Have a button in the body of text to toggle light/dark mode?

[ArcTrooper210]

Is there a way to add an icon that is within the text body that functions the same as the light/dark mode toggle in the header?

[kamilkrzyskow]

Hello @ArcTrooper210,
this should be possible using extra JavaScript that would be executed on button press inside your content. To make it sync with the button in the header, I would make it so that the logic of your new button simply clicked on the palette button, instead of hooking into / creating custom logic for the palette change.

References which could help you:

• https://squidfunk.github.io/mkdocs-material/customization/#additional-javascript
• https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event#examples
• https://developer.mozilla.org/en-US/docs/Web/CSS/Attribute_selectors

• mkdocs-material/src/templates/partials/palette.html

  Line 24 in 60c0dc1

  <form class="md-header__option" data-md-component="palette">