fix(web): stop the sheet-open rule stealing .sectionNav's layout
PR Checks / Frontend Typecheck + Tests (pull_request) Successful in 1m12s
PR Checks / Backend Smoke (pull_request) Successful in 9s
PR Checks / Build Backend (no push) (pull_request) Successful in 18s
PR Checks / Build Frontend (no push) (pull_request) Successful in 1m17s
PR Checks / Build Pipeline (no push) (pull_request) Successful in 11s
PR Checks / AI Code Review (Claude) (pull_request) Successful in 1m18s
PR Checks / Frontend Typecheck + Tests (pull_request) Successful in 1m12s
PR Checks / Backend Smoke (pull_request) Successful in 9s
PR Checks / Build Backend (no push) (pull_request) Successful in 18s
PR Checks / Build Frontend (no push) (pull_request) Successful in 1m17s
PR Checks / Build Pipeline (no push) (pull_request) Successful in 11s
PR Checks / AI Code Review (Claude) (pull_request) Successful in 1m18s
Review catch, and a bad one: the previous commit anchored its insertion on `padding: 0.5rem 0.75rem;` and closed .sectionNav there. Everything that followed in the rule — margin-bottom, box-shadow, display: flex, align-items, gap — was orphaned into .sectionNavSheetOpen, which is only applied while the mobile jump sheet is open. So the sticky nav lost its flex layout, spacing and shadow in the closed state, which is virtually every page view on every school detail page. A site-wide regression introduced by a fix for one mobile menu. Redone by anchoring on the complete rule, closing brace included, so nothing can be orphaned. .sectionNav is now byte-identical to main and the diff is purely additive; .sectionNavSheetOpen carries the z-index and nothing else. The staging experiment that validated this fix set nav.style.zIndex = '1100' with every other declaration intact, so it was always testing this version rather than the broken one. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
1 parent
180d6e9b3e
commit
0571d1c0ff
1 file changed
+15
-12
@@ -270,23 +270,11 @@
|
||||
position: sticky;
|
||||
top: 64px; /* global header height on desktop */
|
||||
z-index: 10;
|
||||
/* `position: sticky` with a z-index makes this a stacking context, so the
|
||||
jump sheet's own z-index only orders it INSIDE here. Against the fixed
|
||||
bottom tab bar (Navigation.module.css, z-index 1000) what counts is this
|
||||
value — which is why the sheet's last item was painted over, and
|
||||
untappable, once the list grew long enough to reach the bar. Lifted only
|
||||
while the sheet is open, and only to 1100: below the comparison toast
|
||||
(2000), the fullscreen map (5000) and the info popover (9999). */
|
||||
background: var(--bg-card);
|
||||
border: 1px solid var(--border);
|
||||
border-top: none;
|
||||
border-radius: 0 0 10px 10px;
|
||||
padding: 0.5rem 0.75rem;
|
||||
}
|
||||
|
||||
|
||||
.sectionNavSheetOpen {
|
||||
z-index: 1100;
|
||||
margin-bottom: 1rem;
|
||||
box-shadow: 0 2px 4px rgba(var(--shadow-rgb), 0.04);
|
||||
display: flex;
|
||||
@@ -295,6 +283,21 @@
|
||||
}
|
||||
|
||||
|
||||
/* `position: sticky` with a z-index makes .sectionNav a stacking context, so
|
||||
the jump sheet's own z-index only orders it INSIDE that context. Against the
|
||||
fixed bottom tab bar (Navigation.module.css, z-index 1000) what counts is
|
||||
.sectionNav's 10 — which is why the sheet's last item was painted over, and
|
||||
untappable, once the list grew long enough to reach the bar.
|
||||
|
||||
Lifted only while the sheet is open, and only to 1100: above the bar, below
|
||||
the comparison toast (2000), the fullscreen map (5000) and the info popover
|
||||
(9999). This rule carries the z-index and nothing else; every other
|
||||
declaration belongs to .sectionNav in both states. */
|
||||
.sectionNavSheetOpen {
|
||||
z-index: 1100;
|
||||
}
|
||||
|
||||
|
||||
.sectionNavBack {
|
||||
flex: none;
|
||||
display: inline-flex;
|
||||
|
||||
Reference in new issue
Block a user