$v:theme-list
$v:theme-list — Enumerates available themes.
Synopsis
|<xsl:variable name="v:theme-list"
| as="element()*">
| <theme name="Materials dark" id="materials-dark" dark="true"/>
| <theme name="Materials light" id="materials-light" dark="false"/>
|</xsl:variable>
Description
This variable is part of the experimental themes feature. It enumerates the available themes. Each theme has three parts, a name, an ID, and (optionally) an indication of whether or not it’s a “dark” theme.
Themes are implemented in CSS. If the
$theme-picker
is enabled, it will be possible
for the reader to select a theme. The theme names are used for this
purpose.
The ID value is used as a class on the
html
element.
Everything else about the theme is implemented in CSS. To add a new theme,
provide a set of CSS rules that apply when the ID class is in effect.
The dark mode setting is only used as a default. If the document
does not specify a $default-theme
, if the user
has never selected a theme, if the user has enabled dark mode at the
operating system level, and if the browser makes this fact available,
the first “dark” theme will automatically be selected.