Show Cyber's edge lines beside open panels, on both sides

With the panel rails, the left stack's red edge line stood alone beside
the rail whenever no panel was open. It now shows only while a left panel
is open, and the right stack gains the mirrored line for its open panel.
The right stack takes the line and its gap without moving its panels, so
its rail sits outside the line like the left one.
This commit is contained in:
Sameh Khamis committed 2026-11-01 17:05:35 -08:00
1 parent 06994e0d0e
commit 183e651c4c
2 files changed
+29 -4

No files matched your search

+10 -1
View File
@@ -780,7 +780,16 @@ test('the Display selector, voice schema and final stylesheet expose Cyber', ()
assert.match(cyberStyles, /flex: 1 1 auto;/);
assert.match(cyberStyles, /#left-panel-stack:has/);
assert.match(cyberStyles, /left: calc\(54px \+ var\(--panel-rail-clearance\)\);/);
assert.match(cyberStyles, /right: calc\(62px \+ var\(--panel-rail-clearance\)\);/);
assert.match(cyberStyles, /right: calc\(51px \+ var\(--panel-rail-clearance\)\);/);
// Each side's edge line shows only beside an open panel.
assert.match(
cyberStyles,
/#left-panel-stack:has\(> \[data-panel-id\]:not\(\.collapsed, \[hidden\]\)\) \{\s*border-left-color:/,
);
assert.match(
cyberStyles,
/#right-context-rail:has\(> \[data-panel-id\]:not\(\.collapsed, \[hidden\]\)\) \{\s*border-right-color:/,
);
assert.match(cyberStyles, /bottom: calc\(2vh \+ 13rem\);/);
assert.doesNotMatch(cyberStyles, /NAV 01 \/\/ COMMAND BUS \/\/ VIS 03/);
assert.match(cyberStyles, /data-layer-id='satellites'/);
+19 -3
View File
@@ -1661,7 +1661,20 @@
left: calc(54px + var(--panel-rail-clearance));
width: 300px;
padding-left: 10px;
border-left: 1px solid rgba(196, 84, 84, 0.72);
border-left: 1px solid transparent;
}
/* An edge line marks each side's open panel, mirrored left and right. */
:root[data-ui-theme='cyber']
body:not(.cockpit-mode)
#left-panel-stack:has(> [data-panel-id]:not(.collapsed, [hidden])) {
border-left-color: rgba(196, 84, 84, 0.72);
}
:root[data-ui-theme='cyber']
body:not(.cockpit-mode)
#right-context-rail:has(> [data-panel-id]:not(.collapsed, [hidden])) {
border-right-color: rgba(196, 84, 84, 0.72);
}
:root[data-ui-theme='cyber']
@@ -1740,8 +1753,11 @@
:root[data-ui-theme='cyber'] #right-context-rail {
--right-display-collapsed-width: var(--cyber-panel-collapsed-width);
--right-context-collapsed-width: var(--cyber-panel-collapsed-width);
right: calc(62px + var(--panel-rail-clearance));
width: 312px;
/* The edge line and its gap keep the panels where they were. */
right: calc(51px + var(--panel-rail-clearance));
width: 323px;
padding-right: 10px;
border-right: 1px solid transparent;
}
/* The map rails now use one visible expanded width. Keeping the rail itself