summaryrefslogtreecommitdiff
path: root/pyssg.xyz/live/static/scripts
diff options
context:
space:
mode:
Diffstat (limited to 'pyssg.xyz/live/static/scripts')
-rw-r--r--pyssg.xyz/live/static/scripts/theme.js35
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');
+ }
+}