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>
This commit is contained in:
gsinghpal
2026-03-31 22:21:17 -04:00
parent c5d2ac1d6b
commit 396f895ae2
3 changed files with 30 additions and 5 deletions

View File

@@ -45,11 +45,10 @@
--woo-input-border: #d1d5db;
}
/* Dark mode — Odoo 19 applies .o_dark on html or body,
and also uses [style*="color-scheme: dark"] on html */
html.o_dark,
html[style*="color-scheme: dark"],
body.o_dark {
/* Dark mode — theme_detect.js reads Odoo's color_scheme cookie and sets
data-woo-theme="dark" on <html>. We also include @media query as fallback. */
html[data-woo-theme="dark"],
html[style*="color-scheme: dark"] {
--woo-bg-primary: #1e1e2e;
--woo-bg-secondary: #262637;
--woo-bg-tertiary: #2e2e42;