diff options
author | Ryan Schanzenbacher <ryan@rschanz.org> | 2021-12-26 00:30:09 -0500 |
---|---|---|
committer | Ryan Schanzenbacher <ryan@rschanz.org> | 2021-12-26 00:30:09 -0500 |
commit | 98a21b966410c127e74b16e7a2817882ee16560f (patch) | |
tree | ee646c86e3d3f0fa1cd952294d49feeeb700d60f /themes/hugo-coder/assets/js/coder.js | |
parent | e6eec31b71ab728f6610f4e764b2e206fb95f940 (diff) |
convert theme from submodule to regular files
Diffstat (limited to 'themes/hugo-coder/assets/js/coder.js')
m--------- | themes/hugo-coder | 0 | ||||
-rw-r--r-- | themes/hugo-coder/assets/js/coder.js | 40 |
2 files changed, 40 insertions, 0 deletions
diff --git a/themes/hugo-coder b/themes/hugo-coder deleted file mode 160000 | |||
Subproject 55b2a150f990bc56364dba347bc9acc6aab07be | |||
diff --git a/themes/hugo-coder/assets/js/coder.js b/themes/hugo-coder/assets/js/coder.js new file mode 100644 index 0000000..d52db11 --- /dev/null +++ b/themes/hugo-coder/assets/js/coder.js | |||
@@ -0,0 +1,40 @@ | |||
1 | const body = document.body; | ||
2 | const darkModeToggle = document.getElementById('dark-mode-toggle'); | ||
3 | const darkModeMediaQuery = window.matchMedia('(prefers-color-scheme: dark)'); | ||
4 | |||
5 | // Check if user preference is set, if not check value of body class for light or dark else it means that colorscheme = auto | ||
6 | if (localStorage.getItem("colorscheme")) { | ||
7 | setTheme(localStorage.getItem("colorscheme")); | ||
8 | } else if (body.classList.contains('colorscheme-light') || body.classList.contains('colorscheme-dark')) { | ||
9 | setTheme(body.classList.contains("colorscheme-dark") ? "dark" : "light"); | ||
10 | } else { | ||
11 | setTheme(darkModeMediaQuery.matches ? "dark" : "light"); | ||
12 | } | ||
13 | |||
14 | if (darkModeToggle) { | ||
15 | darkModeToggle.addEventListener('click', () => { | ||
16 | let theme = body.classList.contains("colorscheme-dark") ? "light" : "dark"; | ||
17 | setTheme(theme); | ||
18 | rememberTheme(theme); | ||
19 | }); | ||
20 | } | ||
21 | |||
22 | darkModeMediaQuery.addListener((event) => { | ||
23 | setTheme(event.matches ? "dark" : "light"); | ||
24 | }); | ||
25 | |||
26 | document.addEventListener("DOMContentLoaded", function () { | ||
27 | let node = document.querySelector('.preload-transitions'); | ||
28 | node.classList.remove('preload-transitions'); | ||
29 | }); | ||
30 | |||
31 | function setTheme(theme) { | ||
32 | body.classList.remove('colorscheme-auto'); | ||
33 | let inverse = theme === 'dark' ? 'light' : 'dark'; | ||
34 | body.classList.remove('colorscheme-' + inverse); | ||
35 | body.classList.add('colorscheme-' + theme); | ||
36 | } | ||
37 | |||
38 | function rememberTheme(theme) { | ||
39 | localStorage.setItem('colorscheme', theme); | ||
40 | } | ||