diff options
author | David Luevano Alvarado <david@luevano.xyz> | 2022-12-16 17:45:03 -0600 |
---|---|---|
committer | David Luevano Alvarado <david@luevano.xyz> | 2022-12-16 17:45:03 -0600 |
commit | 7e49db5ddefe8c515b5f3931a5c701efaac33d91 (patch) | |
tree | d7d1efda44837a466fe079266efda90021812399 /live/static/scripts/theme.js | |
parent | 3112a76dac594fe715b59e53c399b0dec5b53193 (diff) |
change structure for new pyssg version
Diffstat (limited to 'live/static/scripts/theme.js')
-rw-r--r-- | live/static/scripts/theme.js | 35 |
1 files changed, 35 insertions, 0 deletions
diff --git a/live/static/scripts/theme.js b/live/static/scripts/theme.js new file mode 100644 index 0000000..a107101 --- /dev/null +++ b/live/static/scripts/theme.js @@ -0,0 +1,35 @@ +// refactored code for a better solution found in: +// https://medium.com/@haxzie/dark-and-light-theme-switcher-using-css-variables-and-pure-javascript-zocada-dd0059d72fa2 +var local_storage = window.localStorage; + +// changed window.onload to document.addEventListener, as suggested here: +// https://stackoverflow.com/a/800010 +document.addEventListener("DOMContentLoaded", function(event) { + let theme = local_storage.getItem('theme'); + + if(theme == null){ + local_storage.setItem('theme', 'theme-dark'); + } + else{ + if(theme == 'theme-dark'){ + setTheme('theme-dark'); + } + else{ + setTheme('theme-light'); + } + } +}) + +function setTheme(themeName){ + local_storage.setItem('theme', themeName) + document.documentElement.className = themeName; +} + +function toggleTheme(){ + if (local_storage.getItem('theme') == 'theme-dark') { + setTheme('theme-light'); + } + else{ + setTheme('theme-dark'); + } +} |