darkmode auto, light, dark

2022-03-04 16:46:32 +05:30
parent 47f9d64515
commit 05e453ad83
5 changed files with 82 additions and 1 deletions
@@ -1,3 +1,34 @@
+{{- if (eq .Site.Params.theme.defaultTheme "light") }}
+<script>
+    if (document.body.className.includes("dark")) {
+        document.body.classList.remove('dark');
+        localStorage.setItem("pref-theme", 'light');
+    }
+</script>
+
+{{ else if (eq .Site.Params.theme.defaultTheme "dark") }}
+{{- /* theme is dark */}}
+<script>
+    if (document.body.className.includes("light")) {
+        document.body.classList.add('dark');
+        localStorage.setItem("pref-theme", 'dark');
+    }
+</script>
+
+{{- else }}
+{{- /* theme is auto */}}
+<script>
+    if (localStorage.getItem("pref-theme") === "dark") {
+        document.body.classList.add('dark');
+    } else if (localStorage.getItem("pref-theme") === "light") {
+        document.body.classList.remove('dark')
+    } else if (window.matchMedia('(prefers-color-scheme: dark)').matches) {
+        document.body.classList.add('dark');
+    }
+
+</script>
+{{- end }}
+
 {{- if (not .Site.Params.theme.disableThemeToggle) }}
 <script>
    document.getElementById("theme-toggle").addEventListener("click", () => {