diff options
author | David Luevano Alvarado <david@luevano.xyz> | 2022-12-13 20:44:08 -0600 |
---|---|---|
committer | David Luevano Alvarado <david@luevano.xyz> | 2022-12-13 20:44:08 -0600 |
commit | abc0de079b895af1b705894eb2b63596e3e37274 (patch) | |
tree | c51d24dce55da8d9b227cbac6c2ef64a59d8e9dc /pyssg.xyz/live/static/scripts | |
parent | db4b3736d4f45137a733ce5eb1e50aec968ca1d2 (diff) |
add pyssg.xyz configs and templates
Diffstat (limited to 'pyssg.xyz/live/static/scripts')
-rw-r--r-- | pyssg.xyz/live/static/scripts/theme.js | 35 |
1 files changed, 35 insertions, 0 deletions
diff --git a/pyssg.xyz/live/static/scripts/theme.js b/pyssg.xyz/live/static/scripts/theme.js new file mode 100644 index 0000000..a107101 --- /dev/null +++ b/pyssg.xyz/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'); + } +} |