From a63fbe15588b14c4420c6ec9c2bf0cc6490b94cb Mon Sep 17 00:00:00 2001 From: gsinghpal Date: Sun, 17 May 2026 04:00:47 -0400 Subject: [PATCH] fix(portal): restore .o_fp_step_line nesting inside .o_fp_stepper Regression from the pulse-animation commit: the @media (prefers- reduced-motion) block had crept up and swallowed the .o_fp_step_line rule, so the connector lines only got flex:1 when the user had reduce-motion enabled. Everywhere else they had zero width and the circles clustered on the left of the row with no visible gaps. Moved .o_fp_step_line back inside the parent .o_fp_stepper { } where it belongs. Added a comment so the next person doesn't make the same mistake when editing the surrounding rules. Co-Authored-By: Claude Opus 4.7 (1M context) --- .../static/src/scss/fp_portal_stepper.scss | 21 +++++++++++-------- 1 file changed, 12 insertions(+), 9 deletions(-) diff --git a/fusion_plating/fusion_plating_portal/static/src/scss/fp_portal_stepper.scss b/fusion_plating/fusion_plating_portal/static/src/scss/fp_portal_stepper.scss index 7c8c3f28..b9f23b8c 100644 --- a/fusion_plating/fusion_plating_portal/static/src/scss/fp_portal_stepper.scss +++ b/fusion_plating/fusion_plating_portal/static/src/scss/fp_portal_stepper.scss @@ -46,6 +46,18 @@ box-shadow: $fp-glow-ring-amber; animation: fp-pulse-amber 1.8s ease-in-out infinite; } + + // Connector lines that flex-grow to fill the row between circles. + // MUST stay nested inside .o_fp_stepper or flex:1 doesn't apply + // (and the circles cluster on the left with no gaps). + .o_fp_step_line { + flex: 1; + height: 2px; + margin: 0 3px; + background: $fp-card-border; + &.o_fp_step_line_done { background: $fp-teal; } + &.o_fp_step_line_warn { background: $fp-amber; } + } } // Pulsing glow for the active step indicator. Kept subtle - the ring @@ -69,15 +81,6 @@ .o_fp_timeline_active .o_fp_timeline_dot { animation: none; } - - .o_fp_step_line { - flex: 1; - height: 2px; - margin: 0 3px; - background: $fp-card-border; - &.o_fp_step_line_done { background: $fp-teal; } - &.o_fp_step_line_warn { background: $fp-amber; } - } } // Step labels row below the stepper