fix: proper Odoo 19 dark mode detection via cookie-based theme_detect.js

Odoo 19 does NOT use .o_dark class or data-bs-theme attribute. It sets color-scheme via SCSS and stores preference in color_scheme cookie. Added theme_detect.js that reads the cookie and sets data-woo-theme="dark" on <html> for reliable CSS targeting. Fixed CSS dark mode selectors. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-03-31 22:21:17 -04:00
parent c5d2ac1d6b
commit 396f895ae2
3 changed files with 30 additions and 5 deletions
--- a/fusion-woo-odoo/fusion_woocommerce/static/src/js/theme_detect.js
+++ b/fusion-woo-odoo/fusion_woocommerce/static/src/js/theme_detect.js
@@ -0,0 +1,25 @@
+/** @odoo-module **/
+
+/**
+ * Theme detection for Fusion WooCommerce.
+ *
+ * Odoo 19 stores dark mode preference in the "color_scheme" cookie ("dark" or "bright").
+ * It also sets `color-scheme: dark` on .o_web_client via SCSS.
+ *
+ * This script reads the cookie and adds a `data-woo-theme="dark"` attribute on <html>
+ * so our CSS can target it reliably. It also observes for changes (user toggles theme).
+ */
+import { cookie } from "@web/core/browser/cookie";
+
+function applyTheme() {
+    const scheme = cookie.get("color_scheme");
+    const isDark = scheme === "dark";
+    document.documentElement.setAttribute("data-woo-theme", isDark ? "dark" : "light");
+}
+
+// Apply on load
+applyTheme();
+
+// Re-apply periodically in case user toggles theme mid-session
+// (Odoo doesn't fire a DOM event for this, so we poll the cookie)
+setInterval(applyTheme, 2000);