benmichael/gods-eye-view
1
0 Fork 0
mirror of https://github.com/bilawalsidhu/gods-eye-view.git synced 2026-11-05 10:53:59 +00:00
Code Issues Packages Projects Releases Wiki Activity

style: format the UI shell and component styles

Browse Source
This commit is contained in:
Sameh Khamis committed 2026-09-13 04:26:11 -07:00
1 parent f5ef9091f0
commit 03ad8142e6
32 files changed
+4126 -1546
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

src/ui/styles/scenes.css
+39 -11
View File
@@ -35,7 +35,9 @@
order: 2;
}
#left-panel-stack > #scene-panel { order: 4; }
#left-panel-stack > #scene-panel {
order: 4;
}
/*
* Runtime focus mode: the layout engine applies this only when the expanded
@@ -59,7 +61,8 @@
* When an expanded panel and its collapsed siblings fit together, preserve
* the canonical control order and center their combined stack at 50vh.
*/
#left-panel-stack.layout-tail > :is(#data-panel, #cctv-panel, #scene-panel):not(.collapsed) {
#left-panel-stack.layout-tail
> :is(#data-panel, #cctv-panel, #scene-panel):not(.collapsed) {
box-sizing: border-box;
flex: 0 0 var(--left-panel-allocated-height);
height: var(--left-panel-allocated-height);
@@ -91,19 +94,33 @@
}
#left-panel-stack > [data-panel-id]:not(.collapsed) .panel-divider {
background: linear-gradient(90deg, rgb(0 212 255 / 28%), rgba(0, 212, 255, 0.18) 58%, transparent);
background: linear-gradient(
90deg,
rgb(0 212 255 / 28%),
rgba(0, 212, 255, 0.18) 58%,
transparent
);
box-shadow: 0 0 7px rgba(0, 212, 255, 0.22);
}
#right-context-rail [data-panel-id]:not(.collapsed) .panel-divider {
background: linear-gradient(90deg, rgb(0 212 255 / 28%), rgba(0, 212, 255, 0.18) 58%, transparent);
background: linear-gradient(
90deg,
rgb(0 212 255 / 28%),
rgba(0, 212, 255, 0.18) 58%,
transparent
);
box-shadow: 0 0 7px rgba(0, 212, 255, 0.22);
}
#scene-panel .panel-glow {
position: absolute;
inset: -18px;
background: radial-gradient(ellipse at center, rgba(0, 212, 255, 0.16) 0%, transparent 65%);
background: radial-gradient(
ellipse at center,
rgba(0, 212, 255, 0.16) 0%,
transparent 65%
);
filter: blur(16px);
opacity: 0.25;
pointer-events: none;
@@ -209,7 +226,9 @@
border-radius: 9px;
padding: 7px 8px;
background: rgba(255, 255, 255, 0.03);
transition: border-color var(--transition-fast), background var(--transition-fast);
transition:
border-color var(--transition-fast),
background var(--transition-fast);
}
.scene-shot-row.active {
@@ -300,7 +319,11 @@
#scene-progress-fill {
width: 0%;
height: 100%;
background: linear-gradient(90deg, rgba(0, 212, 255, 0.2), rgba(0, 212, 255, 0.75));
background: linear-gradient(
90deg,
rgba(0, 212, 255, 0.2),
rgba(0, 212, 255, 0.75)
);
color: #d5f7ff;
font-family: var(--font-mono);
font-size: 8px;
@@ -329,7 +352,9 @@
z-index: 105;
opacity: 0;
visibility: hidden;
transition: opacity 180ms ease, visibility 180ms ease;
transition:
opacity 180ms ease,
visibility 180ms ease;
font-family: var(--font-mono);
font-size: 11px;
letter-spacing: 2px;
@@ -354,7 +379,9 @@
#global-context-panel.collapsed .global-context-actions,
#global-context-panel.collapsed .global-context-modes,
#global-context-panel.collapsed .context-mode-view,
#global-context-panel.collapsed > .global-context-panel-inner > .context-mode-standby,
#global-context-panel.collapsed
> .global-context-panel-inner
> .context-mode-standby,
#radio-panel.collapsed .radio-panel-inner > :not(.panel-header),
#cctv-panel.collapsed .cctv-controls,
#cctv-panel.collapsed .cctv-calibration-block,
@@ -380,7 +407,9 @@
width: var(--left-collapsed-width);
}
#global-context-panel #radio-panel.collapsed { width: 100%; }
#global-context-panel #radio-panel.collapsed {
width: 100%;
}
#data-panel.collapsed .panel-title,
#cctv-panel.collapsed .panel-title,
@@ -409,4 +438,3 @@
#param-slider-panel.collapsed .param-panel-header {
margin-bottom: 2px;
}