fix palerColor with gradients

src/seqta/ui/Colors.js

@@ -20,6 +20,7 @@ export function updateAllColors(storedSetting, newColor = null) {
 
   // Mode-based properties, applied if storedSetting is provided
   let modeProps = {};
+  console.log(DarkMode);
   if (DarkMode !== null) {
     modeProps = DarkMode ? {
       "--background-primary": "#232323",
@@ -29,10 +30,12 @@ export function updateAllColors(storedSetting, newColor = null) {
       "--background-primary": "#ffffff",
       "--background-secondary": "#e5e7eb",
       "--text-primary": "black",
-      "--better-pale": lightenAndPaleColor(selectedColor)  // Wrap this in try-catch if needed
+      "--better-pale": lightenAndPaleColor(selectedColor)
     };
   }
 
+  console.log("modeProps:", modeProps);
+
   // Dynamic properties, always applied
   const rgbThreshold = GetThresholdofHex(selectedColor);
   const isBright = rgbThreshold > 210;
@@ -50,3 +53,14 @@ export function updateAllColors(storedSetting, newColor = null) {
     document.querySelector("link[rel*='icon']").href = getChromeURL("icons/icon-48.png");
   }
 }
+
+export function getDarkMode() {
+  return new Promise((resolve, reject) => {
+    chrome.storage.local.get("DarkMode", (result) => {
+      if (chrome.runtime.lastError) {
+        return reject(chrome.runtime.lastError);
+      }
+      resolve(result.DarkMode);
+    });
+  });
+}

src/seqta/utils/StorageListener.js

@@ -10,10 +10,11 @@ import {
   enableNotificationCollector,
 } from "../../SEQTA.js";
 import { updateBgDurations } from "../ui/Animation.js";
-import { updateAllColors } from "../ui/Colors.js";
+import { getDarkMode, updateAllColors } from "../ui/Colors.js";
 
 export default class StorageListener {
   constructor() {
+    this.darkMode = getDarkMode();
     chrome.storage.onChanged.addListener(this.handleStorageChanges.bind(this));
   }
 
@@ -29,6 +30,10 @@ export default class StorageListener {
       );
     }
 
+    if (changes.DarkMode) {
+      this.darkMode = changes.DarkMode.newValue;
+    }
+
     if (changes?.customshortcuts?.newValue) {
       this.handleCustomShortcutsChange(
         changes.customshortcuts.oldValue,
@@ -56,7 +61,7 @@ export default class StorageListener {
 
   handleSelectedColorChange(newColor) {
     try {
-      updateAllColors(null, newColor);
+      updateAllColors(this.darkMode, newColor);
     } catch (err) {
       console.error(err);
     }