diff options
Diffstat (limited to 'themes/hugo-coder/assets/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 | } | ||
