feat(ui): Theme toggle component

[edda]

Create a theme toggle component.

Features:

• [ ] Allows selection of theme (currently dark/light/system)
• [ ] Saves user selection in browser local storage (namespace key!)
• [ ] Initial state on mount should be (in order of preference): value from local storage > value from props > default theme
• [ ] Revisit/update naming of themes and theme classes in StyleProvider

[franzheidl]

Currently, the classes on the app body are called theme-light and theme-dark respectively.

StyleProvider expects a theme prop that it will remap to themeClassName which will be used as-is if supplied or default to theme-dark (while at it, we could use a default-prop, currently this is defaulting "manually").

When introducing a useTheme hook, all the logic deciding about the theme should go there. StyleProvider should only recevie a theme prop, and attach the respective styles and className.

We should revisit naming of the props and classNames representing a theme:

• is "theme-" prefix necessary? If yes, can we auto-generate it so we do not have to communicate and enforce manually setting the prefix?
• Isn't a "juno-" prefix even more important? Keep "juno-" prtefix to our own supplied themes (light, dark) ONKLY, and allow unprefxied custom themes?