feat: mode-aware subreddit color overrides with v1→v2 migration

Co-authored-by: Cursor <cursoragent@cursor.com>

content/tweaks/badges.js

@@ -24,7 +24,8 @@
       container.classList.remove("rt-dark");
     }
 
-    const overrides = subredditName && settings.subredditColors[subredditName];
+    const entry = subredditName && settings.subredditColors[subredditName];
+    const overrides = entry && entry[prefix];
 
     container.style.setProperty("--rt-sub-bg", overrides?.bg || settings[prefix + ".subredditBgColor"]);
     container.style.setProperty("--rt-sub-border", overrides?.border || settings[prefix + ".subredditBorderColor"]);
@@ -58,6 +59,7 @@
       badge.href = subLink.href;
       badge.textContent = subLink.textContent.trim();
       subredditName = subLink.textContent.trim().replace(/^r\//, "");
+      container.setAttribute("data-rt-subreddit", subredditName);
       container.appendChild(badge);
 
       const prevNode = subLink.previousSibling;
@@ -139,10 +141,7 @@
     currentSettings = settings;
     const containers = document.querySelectorAll(".reddit-tweaks-badges");
     containers.forEach(function (container) {
-      const subBadge = container.querySelector(".rt-badge--subreddit");
-      const subredditName = subBadge
-        ? subBadge.textContent.trim().replace(/^r\//, "")
-        : null;
+      const subredditName = container.getAttribute("data-rt-subreddit");
       applyColorsToContainer(container, settings, subredditName);
     });
   }
@@ -158,5 +157,7 @@
   window.RedditTweaks.badgeTweak = {
     apply: apply,
     updateColors: updateColors,
+    isDarkMode: isDarkMode,
+    getColorPrefix: getColorPrefix,
   };
 })();

lib/settings.js

@@ -19,10 +19,29 @@
     subredditColors: {},
   };
 
+  function migrateSubredditColors(colors) {
+    let migrated = false;
+    const result = {};
+    for (const name of Object.keys(colors)) {
+      const entry = colors[name];
+      if (entry && entry.bg !== undefined && !entry.light && !entry.dark) {
+        result[name] = { light: { bg: entry.bg, border: entry.border, text: entry.text }, dark: { bg: entry.bg, border: entry.border, text: entry.text } };
+        migrated = true;
+      } else {
+        result[name] = entry;
+      }
+    }
+    return { result: result, migrated: migrated };
+  }
+
   async function loadSettings() {
     const stored = await browser.storage.local.get(null);
     const merged = Object.assign({}, DEFAULTS, stored);
-    merged.subredditColors = Object.assign({}, merged.subredditColors);
+    const migration = migrateSubredditColors(merged.subredditColors || {});
+    merged.subredditColors = migration.result;
+    if (migration.migrated) {
+      await browser.storage.local.set({ subredditColors: merged.subredditColors });
+    }
     return merged;
   }