fix: thorough dark mode fixes across all OWL templates and CSS

- Replace Bootstrap badge classes with theme-aware woo-badge classes in
  product mapping tabs
- Replace <code> with theme-aware .woo-code class
- Replace all text-muted with woo-text-muted using CSS custom properties
- Add client action wrapper background
- Add theme-aware select/checkbox/strong/input overrides
- Add .woo-code, .woo-text-muted, .woo-text-faint utility classes

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
gsinghpal
2026-03-31 22:12:10 -04:00
parent 645119c9b7
commit c5d2ac1d6b
5 changed files with 86 additions and 7 deletions

View File

@@ -476,3 +476,82 @@ body.o_dark {
width: 36px;
text-align: center;
}
/* ----------------------------------------------------------
Theme-aware utility classes
---------------------------------------------------------- */
.woo-text-muted { color: var(--woo-text-muted) !important; }
.woo-text-faint { color: var(--woo-text-faint) !important; }
/* Inline code snippets (SKU etc.) */
.woo-code {
font-family: monospace;
font-size: 0.85em;
padding: 1px 6px;
border-radius: 4px;
background: var(--woo-bg-tertiary);
color: var(--woo-text-secondary);
}
/* ----------------------------------------------------------
Client action wrapper — ensure background matches theme
---------------------------------------------------------- */
.o_action.o_client_action .woo-dashboard,
.o_action.o_client_action .p-3 {
background: var(--woo-bg-primary);
color: var(--woo-text-primary);
min-height: 100%;
}
/* ----------------------------------------------------------
Form view overrides — theme-aware inputs in Odoo forms
---------------------------------------------------------- */
.o_form_view .woo-table th {
background: var(--woo-bg-tertiary);
color: var(--woo-text-secondary);
}
.o_form_view .woo-table td {
color: var(--woo-text-secondary);
border-bottom-color: var(--woo-border-light);
}
/* ----------------------------------------------------------
Checkbox overrides for dark mode
---------------------------------------------------------- */
.woo-table input[type="checkbox"],
.woo-topbar input[type="checkbox"] {
accent-color: var(--woo-accent);
}
/* ----------------------------------------------------------
Select dropdown — theme aware
---------------------------------------------------------- */
.woo-topbar select {
background: var(--woo-input-bg);
color: var(--woo-text-primary);
border-color: var(--woo-input-border);
}
.woo-topbar select option {
background: var(--woo-bg-primary);
color: var(--woo-text-primary);
}
/* ----------------------------------------------------------
Odoo native overrides for our views
These ensure Odoo's own notebook/tab/statusbar elements
inside our module's form views respect the theme.
---------------------------------------------------------- */
.o_form_view .o_notebook .nav-link {
color: var(--woo-text-muted);
}
.o_form_view .o_notebook .nav-link.active {
color: var(--woo-text-primary);
}
/* ----------------------------------------------------------
Ensure strong/bold text uses theme colour
---------------------------------------------------------- */
.woo-table strong,
.woo-card strong {
color: var(--woo-text-primary);
}