From d0eefe6392aad0b7e0cee8d2e9988d2321c1fa9e Mon Sep 17 00:00:00 2001 From: gsinghpal Date: Thu, 23 Apr 2026 07:35:11 -0400 Subject: [PATCH] fix(configurator): Process Composer dark-mode palette (Sub 3 follow-up) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Process Composer was rendering a white card background on dark-mode tenants because the SCSS relied on var(--bs-body-bg, #ffffff) — the Bootstrap CSS variable doesn't flip reliably in Odoo 19's backend, and the hardcoded fallback kicked in. Rewrote with the shopfloor token pattern from CLAUDE.md: branch on $o-webclient-color-scheme == dark at compile time, expose via CSS custom properties (--fp-composer-card / -border / -panel / -text / -muted), drop every --bs-* fallback for layout colours. Cleared the ir_attachment asset cache on entech so both the backend and web_dark bundles recompile cleanly. fusion_plating_configurator → 19.0.12.1.0 Co-Authored-By: Claude Opus 4.7 (1M context) --- .../__manifest__.py | 2 +- .../src/scss/fp_part_process_composer.scss | 55 ++++++++++++++++--- 2 files changed, 49 insertions(+), 8 deletions(-) diff --git a/fusion_plating/fusion_plating_configurator/__manifest__.py b/fusion_plating/fusion_plating_configurator/__manifest__.py index 6054895e..d966a689 100644 --- a/fusion_plating/fusion_plating_configurator/__manifest__.py +++ b/fusion_plating/fusion_plating_configurator/__manifest__.py @@ -5,7 +5,7 @@ { 'name': 'Fusion Plating — Configurator', - 'version': '19.0.12.0.0', + 'version': '19.0.12.1.0', 'category': 'Manufacturing/Plating', 'summary': 'Quotation configurator with part catalog, coating configs, and formula-based pricing engine.', 'description': """ diff --git a/fusion_plating/fusion_plating_configurator/static/src/scss/fp_part_process_composer.scss b/fusion_plating/fusion_plating_configurator/static/src/scss/fp_part_process_composer.scss index a2f9d550..963071ff 100644 --- a/fusion_plating/fusion_plating_configurator/static/src/scss/fp_part_process_composer.scss +++ b/fusion_plating/fusion_plating_configurator/static/src/scss/fp_part_process_composer.scss @@ -3,16 +3,52 @@ // Part of the Fusion Plating product family. // // Sub 3 — Process Composer styles. +// +// Theme handling: Odoo 19 compiles this SCSS into BOTH web.assets_backend +// (bright) and web.assets_web_dark (dark). We branch at compile time on +// $o-webclient-color-scheme so the dark bundle gets distinct colours. +// Bootstrap CSS variables (--bs-body-bg etc.) don't flip reliably in +// Odoo 19's backend — hardcoded hex via CSS custom properties is the +// pattern documented in CLAUDE.md (shopfloor tokens). + +$o-webclient-color-scheme: bright !default; + +// ---- Token defaults (bright mode) ---- +$_fp-composer-page-hex: #f3f4f6; +$_fp-composer-card-hex: #ffffff; +$_fp-composer-border-hex: #d8dadd; +$_fp-composer-panel-hex: #f5f5f5; +$_fp-composer-text-hex: #1f2328; +$_fp-composer-muted-hex: #6a737d; + +@if $o-webclient-color-scheme == dark { + $_fp-composer-page-hex: #1a1d21 !global; + $_fp-composer-card-hex: #22262d !global; + $_fp-composer-border-hex: #3a3f47 !global; + $_fp-composer-panel-hex: #2a2f36 !global; + $_fp-composer-text-hex: #e6e6e6 !global; + $_fp-composer-muted-hex: #9aa0a6 !global; +} + +// Expose as CSS custom properties so admins can override per-company +// without recompiling. Token names intentionally unique to this module +// to avoid collisions with shopfloor / plant-overview tokens. +$fp-composer-card: var(--fp-composer-card, $_fp-composer-card-hex); +$fp-composer-border: var(--fp-composer-border, $_fp-composer-border-hex); +$fp-composer-panel: var(--fp-composer-panel, $_fp-composer-panel-hex); +$fp-composer-text: var(--fp-composer-text, $_fp-composer-text-hex); +$fp-composer-muted: var(--fp-composer-muted, $_fp-composer-muted-hex); .o_fp_part_composer { padding: 16px; max-width: 900px; margin: 0 auto; + color: $fp-composer-text; &_state { padding: 32px; text-align: center; - color: var(--bs-secondary-color, #666); + color: $fp-composer-muted; .fa { margin-right: 8px; @@ -29,13 +65,14 @@ gap: 16px; margin-bottom: 24px; padding-bottom: 16px; - border-bottom: 1px solid var(--bs-border-color, #e0e0e0); + border-bottom: 1px solid $fp-composer-border; } &_title { h2 { margin: 0; font-size: 20px; + color: $fp-composer-text; } } @@ -45,12 +82,14 @@ gap: 12px; margin-bottom: 24px; padding: 16px; - background: var(--bs-tertiary-bg, #f5f5f5); + background: $fp-composer-panel; + border: 1px solid $fp-composer-border; border-radius: 8px; label { margin: 0; font-weight: 600; + color: $fp-composer-text; } select { @@ -62,23 +101,25 @@ &_tree { min-height: 300px; padding: 24px; - background: var(--bs-body-bg, #ffffff); + background: $fp-composer-card; + color: $fp-composer-text; border-radius: 8px; - border: 1px solid var(--bs-border-color, #d8dadd); + border: 1px solid $fp-composer-border; } &_hint, &_empty { text-align: center; padding: 48px 16px; + color: $fp-composer-muted; .fa { - color: var(--bs-secondary-color, #999); + color: $fp-composer-muted; margin-bottom: 16px; } p { - color: var(--bs-secondary-color, #666); + color: $fp-composer-muted; } } }