AnswerDotAI / AnswerDotAI/MonsterUI

Dark/Light Mode Toggle Component

Open
#75 0 comments 1 reaction 0 assignees View on GitHub
enhancement
Dominant language
Jupyter Notebook
Stars
522
Forks
33
Avg merge
1m
Merged PRs (30d)
1

Description

ThemePicker seems great, but I would like to configure it as a switch and not to have a lot of choice in the UI, this is what I tried but I does not work.

```python
def ex_theme_switcher2():
switch = Switch(id="theme-switch", cls="ml-4", data_hx_trigger="change", data_hx_target="body", data_hx_swap="outerHTML")

light_theme = ThemePicker(color="orange", radii="uk-radii-md", shadows="uk-shadows-md", font="uk-font-base", mode="light", cls="hidden")
dark_theme = ThemePicker(color="orange", radii="uk-radii-md", shadows="uk-shadows-md", font="uk-font-base", mode="dark", cls="hidden")

return Div(
Div("Dark Mode", switch, cls="flex items-center space-x-2"),
Div(light_theme, id="light-theme", cls="hidden"),
Div(dark_theme, id="dark-theme", cls="hidden"),
)

```

Goal is just to have a small switch that will change theme on click to Dark / White.

Can this be accomplished with a Switch, only way for me to change theme that was working is with having full Theme Picker UI and pressing Dark or Light button.

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.