From 5f9efe49bd3324f2358f9990ade40b056f8c8b20 Mon Sep 17 00:00:00 2001
From: Jimmy Cai <jimmehcai@gmail.com>
Date: Wed, 23 Dec 2020 18:34:06 +0100
Subject: [PATCH] refactor(darkmode): simplify code

---
 layouts/partials/head/colorScheme.html | 36 ++++++++++++++++----------
 1 file changed, 22 insertions(+), 14 deletions(-)

diff --git a/layouts/partials/head/colorScheme.html b/layouts/partials/head/colorScheme.html
index 40d765f..560d6c0 100644
--- a/layouts/partials/head/colorScheme.html
+++ b/layouts/partials/head/colorScheme.html
@@ -1,27 +1,35 @@
-{{- with .Site.Params.colorScheme -}}
-    {{/* If toggle is disabled, set color to default */}}
-    {{- $defaultColorScheme := default "default" .default -}}
-    {{- if not .toggle -}}
-        <script>
-            (function() {
-                const colorSchemeKey = 'StackColorScheme';
-                localStorage.setItem(colorSchemeKey, {{ $defaultColorScheme }});
-            })();
-        </script>
-    {{- end -}}
+{{- $defaultColorScheme := default "auto" .Site.Params.colorScheme.default -}}
+{{- if not (default false .Site.Params.colorScheme.toggle) -}}
+    {{/* If toggle is disabled, force default scheme */}}
+    <script>
+        (function() {
+            const colorSchemeKey = 'StackColorScheme';
+            localStorage.setItem(colorSchemeKey, "{{ $defaultColorScheme }}");
+        })();
+    </script>
+{{- else -}}
+    {{/* Otherwise set to default scheme only if no preference is set by user */}}
+    <script>
+        (function() {
+            const colorSchemeKey = 'StackColorScheme';
+            if(!localStorage.getItem(colorSchemeKey)){
+                localStorage.setItem(colorSchemeKey, "{{ $defaultColorScheme }}");
+            }
+        })();
+    </script>
 {{- end -}}
+
 <script>
     (function() {
         const colorSchemeKey = 'StackColorScheme';
         const colorSchemeItem = localStorage.getItem(colorSchemeKey);
         const supportDarkMode = window.matchMedia('(prefers-color-scheme: dark)').matches === true;
 
-        if (colorSchemeItem == 'dark' || !colorSchemeItem && supportDarkMode || colorSchemeItem === 'auto' && supportDarkMode) {
+        if (colorSchemeItem == 'dark' || colorSchemeItem === 'auto' && supportDarkMode) {
             /**
              * Enable dark mode if:
              * 1. If dark mode is set already (in local storage)
-             * 2. No color scheme preference is set in localstorage, and user's browser indicates preference for dark mode
-             * 3. Auto mode & prefere color scheme is dark
+             * 2. Auto mode & prefere color scheme is dark
              */
             document.body.dataset.scheme = 'dark';
         } else {