Merge pull request #83 from davidkaufmann/main

Fix inability to change themes when media query 'prefers-color-scheme: dark' is set

2 files changed, 8 insertions, 15 deletions

diff --git a/static/css/main.css b/static/css/main.css
index 3ce386f..e4e5973 100644
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -64,21 +64,6 @@
   --inline-cd-color: #37342E;
 }
 
-@media (prefers-color-scheme: dark) {
-  :root {
-    --bg-color: #181714;
-    --txt-color: #FFEECA;
-    --line-color: #433F37;
-    --fn-color: #534F47;
-    --ft-txt-color: #FFEECA;
-    --lk-color: #8192AE;
-    --hover-color: #B1A184;
-    --bq-color: #75271E;
-    --tb1-color: #47443B;
-    --inline-cd-color: #37342E;
-  }
-}
-
 html {
   background-color: var(--bg-color);
 }
diff --git a/static/js/dark-mode.js b/static/js/dark-mode.js
index acea8f8..bffba78 100644
--- a/static/js/dark-mode.js
+++ b/static/js/dark-mode.js
@@ -30,3 +30,11 @@ function switchTheme() {
 }
 
 toggleSwitch.addEventListener('click', switchTheme, false);
+
+window.onload = function() {
+    if (window.matchMedia("(prefers-color-scheme: dark)").matches && !localStorage.getItem('prefers-color-scheme-dark')) {
+        localStorage.setItem('theme', 'light');
+        switchTheme();
+        localStorage.setItem('prefers-color-scheme-dark', true);
+    }
+};