Instantiate the formatter. For all options see Formatter
Optionalconfiguration: Record<string, any> & Partial<options
CSS classes to use in the HTML output. The default classes are defined in defaultCssClasses. You can override them by providing your own classes here:
CSS classes to use in the HTML output. The default classes are defined in defaultCssClasses. You can override them by providing your own classes here:
OptionalcssClasses?: Partial<HtmlTemplateCssClasses>CSS classes to use in the HTML output. The default classes are defined in defaultCssClasses. You can override them by providing your own classes here:
{
cssClasses: {
annotation: 'my-annotation',
chord: 'my-chord',
chordSheet: 'my-chord-sheet',
column: 'my-column',
comment: 'my-comment',
emptyLine: 'my-empty-line',
label: 'my-label',
labelWrapper: 'my-label-wrapper',
line: 'my-line',
literal: 'my-literal',
literalContents: 'my-contents',
lyrics: 'my-lyrics',
paragraph: 'my-paragraph',
row: 'my-row',
subtitle: 'my-subtitle',
title: 'my-title',
}
}
Basic CSS, in object style à la useStyles, to use with the HTML output For a CSS string see cssString
Example:
'.paragraph': {
marginBottom: '1em'
}
the CSS object
Generates basic CSS, optionally scoped within the provided selector, to use with the HTML output
For example, execute cssString('.chordSheetViewer') will result in CSS like:
.chordSheetViewer .paragraph {
margin-bottom: 1em;
}
the CSS scope to use, for example .chordSheetViewer
the CSS string
Formats a song into HTML. It uses DIVs to align lyrics with chords, which makes it useful for responsive web pages.