diff options
author | 135e2 <[email protected]> | 2022-05-29 17:18:06 +0800 |
---|---|---|
committer | 135e2 <[email protected]> | 2022-06-01 23:13:27 +0800 |
commit | a887b07a021540fdbb931693d6fb07edd113e31a (patch) | |
tree | d6f2c3effa2bdb7b6b924ae2d6b87151e8106383 /layout/_partial/header.ejs | |
parent | 02d3b312a452b79126616d9308dc98ab68701be7 (diff) | |
download | chromate-a887b07a021540fdbb931693d6fb07edd113e31a.tar.gz chromate-a887b07a021540fdbb931693d6fb07edd113e31a.tar.bz2 chromate-a887b07a021540fdbb931693d6fb07edd113e31a.zip |
feat: add #btn-toggle-dark botton to toggle dark mode
- Switch dark theme to bulmaswatch/darkly, since bulma-prefers-dark highly relies on `@media: (prefers-color-scheme: dark)` tag
- Add a playerman handler to toggle shikwasa theme[1]
- Use localstorage to store user's preference[2]
- Fix a typo: SystemDarkmodePrefrence => SystemDarkmodePreference
[1]: Modified from https://github.com/jessuni/shikwasa/blob/main/pages/public/index.js#L208
[2]: Took inspiration from https://blog.skk.moe/post/hello-darkmode-my-old-friend
Diffstat (limited to 'layout/_partial/header.ejs')
-rw-r--r-- | layout/_partial/header.ejs | 3 |
1 files changed, 3 insertions, 0 deletions
diff --git a/layout/_partial/header.ejs b/layout/_partial/header.ejs index b32edbb..6c423a0 100644 --- a/layout/_partial/header.ejs +++ b/layout/_partial/header.ejs @@ -18,6 +18,9 @@ </div> <div class="navbar-menu" id="header-menu"> <div class="navbar-end"> + <a class="navbar-item" href="javaScript:void(0);" id="btn-toggle-dark"> + <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"></path></svg> + </a> <% for (let item of theme.menubar) { %> <a class="navbar-item is-uppercase" href="<%= item[0] %>"> <%= item[1] %> |