diff options
author | Amjad Ben Hedhili <amjadhedhili@outlook.com> | 2022-08-21 21:56:12 +0100 |
---|---|---|
committer | GitHub <noreply@github.com> | 2022-08-21 16:56:12 -0400 |
commit | 70a8e0d65c6ada01dac22b77873a0b6a9ea846b7 (patch) | |
tree | 72a3ca334c716555f9f24de7046b0db0d985cd03 /config | |
parent | d8d86e07c39be1d41f2d26eabc8cbdf87b799d8e (diff) | |
download | Nim-70a8e0d65c6ada01dac22b77873a0b6a9ea846b7.tar.gz |
Docs auto dark mode (#20188)
* Implement auto dark mode * Rename class * Fix borders cutout * Apply suggestions from code review * Apply suggestions from code review Co-authored-by: ringabout <43030857+ringabout@users.noreply.github.com>
Diffstat (limited to 'config')
-rw-r--r-- | config/nimdoc.cfg | 26 |
1 files changed, 14 insertions, 12 deletions
diff --git a/config/nimdoc.cfg b/config/nimdoc.cfg index 7aee50d8c..d10c2f318 100644 --- a/config/nimdoc.cfg +++ b/config/nimdoc.cfg @@ -135,12 +135,13 @@ doc.body_toc_groupsection = """ doc.body_toc_group = """ <div class="row"> <div class="three columns"> - <div class="theme-switch-wrapper"> - <label class="theme-switch" for="checkbox"> - <input type="checkbox" id="checkbox" /> - <div class="slider round"></div> - </label> - <em>Dark Mode</em> + <div class="theme-select-wrapper"> + <label for="theme-select">Theme: </label> + <select id="theme-select" onchange="setTheme(this.value)"> + <option value="auto">🌗 Match OS</option> + <option value="dark">🌑 Dark</option> + <option value="light">🌕 Light</option> + </select> </div> <div id="global-links"> <ul class="simple-boot"> @@ -174,12 +175,13 @@ doc.body_toc_group = """ doc.body_toc_group = """ <div class="row"> <div class="three columns"> - <div class="theme-switch-wrapper"> - <label class="theme-switch" for="checkbox"> - <input type="checkbox" id="checkbox" /> - <div class="slider round"></div> - </label> - <em>Dark Mode</em> + <div class="theme-select-wrapper"> + <label for="theme-select">Theme: </label> + <select id="theme-select" onchange="setTheme(this.value)"> + <option value="auto">🌗 Match OS</option> + <option value="dark">🌑 Dark</option> + <option value="light">🌕 Light</option> + </select> </div> <div id="global-links"> <ul class="simple"> |