Make selected theme persist across pages without URL override

Author: Bikram Gole

about.html

@@ -22,7 +22,7 @@
         const params = new URLSearchParams(window.location.search);
         const urlTheme = params.get("theme");
         const savedTheme = window.localStorage.getItem(themeKey);
-        const selected = validThemes.has(urlTheme) ? urlTheme : (validThemes.has(savedTheme) ? savedTheme : null);
+        const selected = validThemes.has(savedTheme) ? savedTheme : (validThemes.has(urlTheme) ? urlTheme : null);
         if (selected) {
           document.documentElement.dataset.theme = selected;
           document.body.dataset.theme = selected;

contact.html

@@ -22,7 +22,7 @@
         const params = new URLSearchParams(window.location.search);
         const urlTheme = params.get("theme");
         const savedTheme = window.localStorage.getItem(themeKey);
-        const selected = validThemes.has(urlTheme) ? urlTheme : (validThemes.has(savedTheme) ? savedTheme : null);
+        const selected = validThemes.has(savedTheme) ? savedTheme : (validThemes.has(urlTheme) ? urlTheme : null);
         if (selected) {
           document.documentElement.dataset.theme = selected;
           document.body.dataset.theme = selected;

index.html

@@ -22,7 +22,7 @@
         const params = new URLSearchParams(window.location.search);
         const urlTheme = params.get("theme");
         const savedTheme = window.localStorage.getItem(themeKey);
-        const selected = validThemes.has(urlTheme) ? urlTheme : (validThemes.has(savedTheme) ? savedTheme : null);
+        const selected = validThemes.has(savedTheme) ? savedTheme : (validThemes.has(urlTheme) ? urlTheme : null);
         if (selected) {
           document.documentElement.dataset.theme = selected;
           document.body.dataset.theme = selected;

script.js

@@ -811,8 +811,8 @@ function initThemeSwitcher() {
   try {
     const urlTheme = getThemeFromUrl();
     const storedTheme = window.localStorage.getItem(THEME_STORAGE_KEY);
-    savedTheme = urlTheme || storedTheme || "neo";
-    if (urlTheme && urlTheme !== storedTheme) {
+    savedTheme = storedTheme || urlTheme || "neo";
+    if (!storedTheme && urlTheme) {
       window.localStorage.setItem(THEME_STORAGE_KEY, urlTheme);
     }
   } catch (error) {
@@ -823,7 +823,7 @@ function initThemeSwitcher() {
   window.addEventListener("pageshow", () => {
     let latestTheme = "neo";
     try {
-      latestTheme = getThemeFromUrl() || window.localStorage.getItem(THEME_STORAGE_KEY) || "neo";
+      latestTheme = window.localStorage.getItem(THEME_STORAGE_KEY) || getThemeFromUrl() || "neo";
     } catch (error) {
       latestTheme = "neo";
     }