fix(ui): give the Cyber stacks the panel rail clearance

The Cyber stack offsets add --panel-rail-clearance so the rails clear the HUD edge readouts.
This commit is contained in:
Sameh Khamis committed 2026-10-30 23:56:20 -07:00
1 parent dc9d200725
commit a767b84486
3 files changed
+7 -6

No files matched your search

+2 -2
View File
@@ -778,8 +778,8 @@ test('the Display selector, voice schema and final stylesheet expose Cyber', ()
assert.match(cyberStyles, /mask-image: linear-gradient\(/); assert.match(cyberStyles, /mask-image: linear-gradient\(/);
assert.match(cyberStyles, /flex: 1 1 auto;/); assert.match(cyberStyles, /flex: 1 1 auto;/);
assert.match(cyberStyles, /#left-panel-stack:has/); assert.match(cyberStyles, /#left-panel-stack:has/);
assert.match(cyberStyles, /left: 54px;/); assert.match(cyberStyles, /left: calc\(54px \+ var\(--panel-rail-clearance\)\);/);
assert.match(cyberStyles, /right: 62px;/); assert.match(cyberStyles, /right: calc\(62px \+ var\(--panel-rail-clearance\)\);/);
assert.match(cyberStyles, /bottom: calc\(2vh \+ 13rem\);/); assert.match(cyberStyles, /bottom: calc\(2vh \+ 13rem\);/);
assert.doesNotMatch(cyberStyles, /NAV 01 \/\/ COMMAND BUS \/\/ VIS 03/); assert.doesNotMatch(cyberStyles, /NAV 01 \/\/ COMMAND BUS \/\/ VIS 03/);
assert.match(cyberStyles, /data-layer-id='satellites'/); assert.match(cyberStyles, /data-layer-id='satellites'/);
+2 -2
View File
@@ -1652,7 +1652,7 @@
:root[data-ui-theme='cyber'] #left-panel-stack { :root[data-ui-theme='cyber'] #left-panel-stack {
top: var(--cyber-left-rail-top) !important; top: var(--cyber-left-rail-top) !important;
bottom: calc(2vh + 13rem); bottom: calc(2vh + 13rem);
left: 54px; left: calc(54px + var(--panel-rail-clearance));
width: 300px; width: 300px;
padding-left: 10px; padding-left: 10px;
border-left: 1px solid rgba(196, 84, 84, 0.72); border-left: 1px solid rgba(196, 84, 84, 0.72);
@@ -1734,7 +1734,7 @@
:root[data-ui-theme='cyber'] #right-context-rail { :root[data-ui-theme='cyber'] #right-context-rail {
--right-display-collapsed-width: var(--cyber-panel-collapsed-width); --right-display-collapsed-width: var(--cyber-panel-collapsed-width);
--right-context-collapsed-width: var(--cyber-panel-collapsed-width); --right-context-collapsed-width: var(--cyber-panel-collapsed-width);
right: 62px; right: calc(62px + var(--panel-rail-clearance));
width: 312px; width: 312px;
} }
+3 -2
View File
@@ -29,8 +29,9 @@
--transition-smooth: 300ms cubic-bezier(0.4, 0, 0.2, 1); --transition-smooth: 300ms cubic-bezier(0.4, 0, 0.2, 1);
/* The side stacks clear the 52px edge gutter that holds the vertical HUD /* The side stacks clear the 52px edge gutter that holds the vertical HUD
readout, plus the floating panel rail (42px) and its 6px gap. */ readout, plus the floating panel rail (42px) and its 6px gap. */
--left-stack-x: 100px; --panel-rail-clearance: 48px;
--right-rail-x: 100px; --left-stack-x: calc(52px + var(--panel-rail-clearance));
--right-rail-x: calc(52px + var(--panel-rail-clearance));
--left-stack-top: 26vh; --left-stack-top: 26vh;
--left-stack-gap: 72px; --left-stack-gap: 72px;
--left-collapsed-width: 176px; --left-collapsed-width: 176px;