feat(fusion_claims): force full-width sheet + 3-col responsive layout at xl

Aggressive sheet override: flex-basis 100%%, !important on width and
max-width to beat parent flex/media-query constraints. Also overrides
the o_form_sheet_bg wrapper.

Layout at xl (>=1200px) now splits into 3 columns:
- Col 1 (3/12): Your Activities + Bottlenecks
- Col 2 (5/12): ADP Pre + ADP Post + MOD
- Col 3 (4/12): Aging + Other Funders + Recent ADP Exports

Falls back to 5/7 on lg (Col 3 wraps below as full row) and stacked
single column on md and below.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
gsinghpal
2026-05-21 04:38:39 -04:00
parent 5295aefd8f
commit 3440e4b7c6
3 changed files with 154 additions and 125 deletions

View File

@@ -3,23 +3,46 @@
// Consumes tokens from _fc_dashboard_tokens.scss (must load FIRST in bundle).
// =============================================================================
// Override Odoo's form-sheet max-width so the dashboard uses the full
// browser width. Class is applied directly to <sheet> (becomes
// .o_form_sheet .o_fc_dashboard_sheet at runtime) — combined with
// !important to beat Odoo's default + parent flex constraints.
// =============================================================================
// Force full-width sheet on the dashboard. The sheet defaults to ~1100-1300px
// max-width via `flex: 1 1 <fixed>` plus a CSS max-width. We override both
// at every possible nesting level + use !important to beat media-query rules.
// =============================================================================
// 1. The sheet itself
.o_fc_dashboard_sheet,
.o_form_sheet.o_fc_dashboard_sheet,
.o_fc_dashboard .o_form_sheet {
max-width: none !important;
.o_form_view .o_fc_dashboard_sheet,
.o_form_renderer .o_fc_dashboard_sheet {
max-width: 100% !important;
width: 100% !important;
flex: 1 1 auto !important;
min-width: 100% !important;
flex: 1 1 100% !important;
flex-basis: 100% !important;
margin: 0 !important;
}
// Some Odoo themes wrap the sheet in a flex container with its own
// max-width; force the wrapper to stretch as well.
.o_form_sheet_bg:has(> .o_fc_dashboard_sheet),
.o_form_view:has(.o_fc_dashboard_sheet) .o_form_sheet_bg {
max-width: none !important;
// 2. The sheet-bg wrapper around the sheet
.o_form_view:has(.o_fc_dashboard_sheet) .o_form_sheet_bg,
.o_form_renderer:has(.o_fc_dashboard_sheet) .o_form_sheet_bg,
.o_form_sheet_bg:has(> .o_fc_dashboard_sheet) {
max-width: 100% !important;
width: 100% !important;
flex: 1 1 100% !important;
}
// 3. The form view itself
.o_form_view.o_fc_dashboard,
.o_form_view:has(.o_fc_dashboard_sheet) {
max-width: 100% !important;
width: 100% !important;
}
// 4. Legacy fallback (older Odoo selector pattern)
.o_fc_dashboard .o_form_sheet {
max-width: 100% !important;
width: 100% !important;
flex: 1 1 100% !important;
}
.o_fc_dashboard {