Expand description
Set the data-theme attribute on the document’s root <html> element
from checkbox/toggle, radio-button, button, and/or <select> controls,
persisting the choice to localStorage and falling back to the
browser’s prefers-color-scheme on first load. See the crate
README for usage
with each control type, and for wiring into tailwindcss/daisyUI.
Functions§
- theme_
buttons - Wires up every
[name=theme-button]button on the page: attaches aclicklistener that setsdata-themeto the clicked button’svalue. - theme_
radio - Wires up every
[name=theme-radios]radio button on the page: checks the one whosevaluematches the resolved theme (see [prefers_color_scheme]), and attaches aclicklistener that setsdata-themeto the checked control’svalue. - theme_
select - Wires up every
[name=theme-select]<select>on the page: sets its value to the resolved theme (see [prefers_color_scheme]), and attaches achangelistener that setsdata-themeto the newly selectedvalue. - theme_
toggle - Wires up every
[name=theme-toggle]checkbox on the page: applies the resolved theme (see [prefers_color_scheme]) as each control’s initialcheckedstate, and attaches aclicklistener that flipsdata-themebetween the control’s declared checked/unchecked values (value="light,dark") — or between its singlevalueand"default"if no comma is present.