Dark mode unless explicitely disabled (sorry)

3 files changed, 10 insertions, 16 deletions

diff --git a/src/config.ts b/src/config.ts
index de7a0218..a5d95c0f 100644
--- a/src/config.ts
+++ b/src/config.ts
@@ -52,6 +52,7 @@ interface SBConfig {
     },
     scrollToEditTimeUpdate: boolean,
     categoryPillUpdate: boolean,
+    lightMode: boolean,
 
     skipKeybind: Keybind,
     startSponsorKeybind: Keybind,
@@ -207,6 +208,7 @@ const Config: SBObject = {
         autoSkipOnMusicVideos: false,
         scrollToEditTimeUpdate: false, // false means the tooltip will be shown
         categoryPillUpdate: false,
+        lightMode: false,
 
         /**
          * Default keybinds should not set "code" as that's gonna be different based on the user's locale. They should also only use EITHER ctrl OR alt modifiers (or none).
diff --git a/src/help.ts b/src/help.ts
index 4c101c64..a3d7a9f8 100644
--- a/src/help.ts
+++ b/src/help.ts
@@ -9,16 +9,12 @@ window.addEventListener('DOMContentLoaded', init);
 async function init() {
     utils.localizeHtmlPage();
 
-    //switch to light mode when requested, except for Chrome on Linux or older Windows/Mac versions, where Chrome doesn't support themes
-    if (window.matchMedia("(prefers-color-scheme: light)")?.matches &&
-            !(navigator.vendor == "Google Inc." && (navigator.userAgent.includes("Linux") ||
-                                                    navigator.userAgent.includes("Windows NT 6") ||
-                                                    navigator.userAgent.includes("Mac OS X") && navigator.userAgent.match(/Mac OS X [^)]+/)[0] < "Mac OS X 10_14") &&
-            !navigator.userAgent.includes("OPR/") && !navigator.userAgent.includes("Edg/")))
-        document.documentElement.setAttribute("data-theme", "light");
-
     await utils.wait(() => Config.config !== null);
 
+    if (Config.config.lightMode) {
+        document.documentElement.setAttribute("data-theme", "light");
+    }
+
     if (!showDonationLink()) {
         document.getElementById("sbDonate").style.display = "none";
     }
diff --git a/src/options.ts b/src/options.ts
index 4597c2cd..a1ab85f0 100644
--- a/src/options.ts
+++ b/src/options.ts
@@ -20,14 +20,6 @@ window.addEventListener('DOMContentLoaded', init);
 async function init() {
     utils.localizeHtmlPage();
 
-    //switch to light mode when requested, except for Chrome on Linux or older Windows/Mac versions, where Chrome doesn't support themes
-    if (window.matchMedia("(prefers-color-scheme: light)")?.matches &&
-            !(navigator.vendor == "Google Inc." && (navigator.userAgent.includes("Linux") ||
-                                                    navigator.userAgent.includes("Windows NT 6") ||
-                                                    navigator.userAgent.includes("Mac OS X") && navigator.userAgent.match(/Mac OS X [^)]+/)[0] < "Mac OS X 10_14") &&
-            !navigator.userAgent.includes("OPR/") && !navigator.userAgent.includes("Edg/")))
-        document.documentElement.setAttribute("data-theme", "light");
-
     // selected tab
     if (location.hash != "") {
         const substr = location.hash.substring(1);
@@ -58,6 +50,10 @@ async function init() {
 
     await utils.wait(() => Config.config !== null);
 
+    if (Config.config.lightMode) {
+        document.documentElement.setAttribute("data-theme", "light");
+    }
+
     if (!showDonationLink()) {
         document.getElementById("sbDonate").classList.add("hidden");
     }