CSS-only theme switcher

#tech

So there you go, it can be done: alexandersandberg.github.io/theme-switcher/unlimited.html

BUT! Limitations he didn't mention:

• You must place the theme selector buttons at the top of the page—above everything else.
  • You can also place them at the bottom by exploiting flex-direction: column-reverse. However, you do that and the theme buttons will be stacked vertically. Until Firefox implements the CSS pseudo-class :has(), you don't get to put them inside a footer div to change the flex-layout.
    • Once Firefox does, it'll also be possible to put them in a sidebar. Mind that the sidebar could not itself be themed, so it's not as great as it seems
• You will still need Javascript to persist the theme choice across different pages. So unless it's a single-page app, not worth bothering.