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

refactor(street-level): simpler panel — native fullscreen, no FOLLOW button, no provider chips

Browse Source 
EXPAND now uses the browser's Fullscreen API on the viewer element, which
stays in the panel; the hand-built modal (re-parenting to <body>, inert
siblings, focus trap, document-level Esc/Tab, Clean View/recording/cockpit
hide rules) is gone. The button is hidden where the API is missing.

The FOLLOW button and the PROVIDERS chip row are removed. The header pill is
the only layer switch and re-enables a provider switched off elsewhere; under
KEY REQUIRED the error line says which key to add. Chip colour support in
chipGroup, dead CSS and tests pinning the removed behaviour go with them.

Co-Authored-By: Claude Opus 5.5 <[email protected]>
This commit is contained in:
German KhokhlovandClaude Opus 5.5 committed 2026-10-07 21:50:11 +04:00
1 parent fbbc4cda5c
commit 7dec7883aa
17 files changed
+285 -1444
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

src/ui/styles/cockpit.css
+1 -2
View File
@@ -1942,8 +1942,7 @@ body.cockpit-mode
#command-dock,
#military-awareness-panel,
#military-awareness-direction-overlay,
#cockpit-entry,
.sl-viewer-wrap-expanded
#cockpit-entry
) {
display: none !important;
}
src/ui/styles/controls.css
+1 -3
View File
@@ -996,9 +996,7 @@ body.ui-clean-view #data-panel,
body.ui-clean-view #cctv-panel,
body.ui-clean-view #radio-panel,
body.ui-clean-view #global-context-panel,
body.ui-clean-view #scene-panel,
/* The expanded viewer lives on <body>, outside every panel. */
body.ui-clean-view .sl-viewer-wrap-expanded {
body.ui-clean-view #scene-panel {
opacity: 0 !important;
visibility: hidden !important;
pointer-events: none !important;
src/ui/styles/recording.css
+1 -3
View File
@@ -15,9 +15,7 @@ body.recording-mode #cctv-panel,
body.recording-mode #radio-panel,
body.recording-mode #global-context-panel,
body.recording-mode #gev-voice-control,
body.recording-mode #scene-panel,
/* The expanded viewer lives on <body>, outside every panel. */
body.recording-mode .sl-viewer-wrap-expanded {
body.recording-mode #scene-panel {
opacity: 0 !important;
visibility: hidden !important;
pointer-events: none !important;
src/ui/styles/street-level.css
+13 -105
View File
@@ -1,8 +1,6 @@
/* ── Street Level panel ─────────────────────────────────────────
The rail owns position and width (layers.css). The expanded viewer is
re-parented to <body>, so it carries the tokens too. */
#street-level-panel,
.sl-viewer-wrap {
The rail owns position and width (layers.css). */
#street-level-panel {
--sl-green: #05cb63;
--sl-text: 0.62rem;
--sl-text-small: 0.6rem;
@@ -132,56 +130,6 @@ button.sl-status:focus-visible {
min-height: 0;
}
/* ── Providers ───────────────────────────────────────────────────────────── */
.sl-providers {
display: flex;
align-items: center;
gap: 8px;
flex-wrap: wrap;
}
.sl-chips {
display: flex;
flex-wrap: wrap;
gap: 4px;
}
/* `--chip-color` comes from the provider. */
.sl-chips .data-toggle-chip {
display: inline-flex;
align-items: center;
gap: 5px;
}
.sl-chips .data-toggle-chip::before {
content: '';
width: 7px;
height: 7px;
border-radius: 50%;
background: var(--chip-color, currentColor);
opacity: 0.45;
flex: none;
}
.sl-chips .data-toggle-chip.active {
color: var(--chip-color, var(--accent));
border-color: var(--chip-color, var(--accent));
background: color-mix(
in srgb,
var(--chip-color, var(--accent)) 14%,
transparent
);
}
.sl-chips .data-toggle-chip.active::before {
opacity: 1;
}
.sl-chips .data-toggle-chip.chip-error {
color: #ffb300;
border-color: rgba(255, 179, 0, 0.55);
}
/* ── Errors ──────────────────────────────────────────────────────────────── */
.sl-error {
font-family: var(--font-sans);
@@ -383,6 +331,10 @@ button.sl-status:focus-visible {
gap: 4px;
}
.sl-viewer-tools .scene-btn[hidden] {
display: none;
}
.sl-viewer-tools .sl-seg {
background: rgba(10, 10, 15, 0.75);
}
@@ -475,65 +427,21 @@ button.sl-status:focus-visible {
display: none;
}
/* ── Expanded viewer ─────────────────────────────────────────────────────── */
/* Re-parented to <body>: the panel's backdrop-filter would contain a fixed
child. z-index sits above panels (≤139), below the voice pill (150). */
.sl-viewer-wrap-expanded {
position: fixed;
left: 4vw;
right: 4vw;
top: 5vh;
bottom: 9vh;
z-index: 141;
display: flex;
flex-direction: column;
font-family: var(--font-mono);
border-color: rgba(0, 212, 255, 0.55);
box-shadow: 0 24px 80px rgba(0, 0, 0, 0.7);
outline: none;
/* ── Full screen (EXPAND) ────────────────────────────────────────────────── */
/* The browser lifts the viewer into the top layer; the photo takes the rest. */
.sl-viewer-wrap:fullscreen {
border: 0;
border-radius: 0;
}
.sl-viewer-wrap-expanded .sl-viewer-stage {
flex: 1 1 auto;
min-height: 0;
}
.sl-viewer-wrap-expanded .sl-viewer {
.sl-viewer-wrap:fullscreen .sl-viewer-stage,
.sl-viewer-wrap:fullscreen .sl-viewer {
flex: 1 1 auto;
height: auto;
min-height: 0;
aspect-ratio: auto;
}
.sl-viewer-wrap-expanded .sl-image-meta {
font-size: 0.66rem;
padding: 10px 14px;
}
.sl-viewer-wrap-expanded .sl-viewer-bar {
padding: 8px 10px;
}
.sl-viewer-wrap-expanded .sl-viewer-tools .scene-btn {
padding: 8px 14px;
font-size: 0.7rem;
letter-spacing: 0.12em;
color: var(--text-primary);
border-color: rgba(0, 212, 255, 0.6);
background: rgba(10, 10, 15, 0.82);
}
.sl-viewer-wrap-expanded #sl-viewer-expand::after {
content: ' · ESC';
color: var(--text-secondary);
}
.sl-viewer-wrap-expanded .sl-viewer-x {
width: 34px;
height: 34px;
font-size: 1.3rem;
}
/* ── Short viewports ─────────────────────────────────────────────────────── */
@media (max-height: 640px) {
.street-level-panel-inner {