mirror of
https://github.com/smittix/intercept.git
synced 2026-06-10 06:53:31 -07:00
fix: apply UI tier to standalone dashboard pages (ADS-B, AIS, Satellite)
Each dashboard is a separate HTML page that doesn't inherit the main SPA's localStorage restore. Add a synchronous tier-restore script before CSS loads so html[data-ui-tier] selectors fire on first paint. Also add enhanced/lean tier override blocks to each dashboard CSS to remap the dashboard-local variables (--bg-dark, --bg-panel, --radar-cyan, etc.) that variables.css doesn't cover, and add lean-mode scanline/bg hide rules since components.css is not loaded on these pages. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -2460,3 +2460,38 @@ body {
|
||||
font-size: 11px;
|
||||
}
|
||||
}
|
||||
|
||||
/* ============================================
|
||||
ENHANCED TIER — amber military console
|
||||
============================================ */
|
||||
html[data-ui-tier="enhanced"] {
|
||||
--bg-dark: #080600;
|
||||
--bg-panel: #0c0a04;
|
||||
--bg-card: #0e0b05;
|
||||
--radar-bg: #0c0a04;
|
||||
--radar-cyan: #c89628;
|
||||
--border-glow: rgba(200, 150, 40, 0.25);
|
||||
--border-color: rgba(200, 150, 40, 0.2);
|
||||
--grid-line: rgba(200, 150, 40, 0.07);
|
||||
--accent-cyan: #c89628;
|
||||
--accent-green: #c89628;
|
||||
}
|
||||
|
||||
/* ============================================
|
||||
LEAN TIER — flat dark, no GPU effects
|
||||
============================================ */
|
||||
html[data-ui-tier="lean"] {
|
||||
--bg-dark: #111111;
|
||||
--bg-panel: #181818;
|
||||
--bg-card: #1a1a1a;
|
||||
--radar-bg: #181818;
|
||||
--border-glow: transparent;
|
||||
--border-color: #2a2a2a;
|
||||
--grid-line: transparent;
|
||||
--noise-image: none;
|
||||
}
|
||||
|
||||
html[data-ui-tier="lean"] .scanline,
|
||||
html[data-ui-tier="lean"] .radar-bg {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@@ -1373,3 +1373,38 @@ body {
|
||||
0%, 100% { opacity: 1; transform: scale(1); }
|
||||
50% { opacity: 0.5; transform: scale(0.8); }
|
||||
}
|
||||
|
||||
/* ============================================
|
||||
ENHANCED TIER — amber military console
|
||||
============================================ */
|
||||
html[data-ui-tier="enhanced"] {
|
||||
--bg-dark: #080600;
|
||||
--bg-panel: #0c0a04;
|
||||
--bg-card: #0e0b05;
|
||||
--radar-bg: #0c0a04;
|
||||
--radar-cyan: #c89628;
|
||||
--border-glow: rgba(200, 150, 40, 0.25);
|
||||
--border-color: rgba(200, 150, 40, 0.2);
|
||||
--grid-line: rgba(200, 150, 40, 0.07);
|
||||
--accent-cyan: #c89628;
|
||||
--accent-green: #c89628;
|
||||
}
|
||||
|
||||
/* ============================================
|
||||
LEAN TIER — flat dark, no GPU effects
|
||||
============================================ */
|
||||
html[data-ui-tier="lean"] {
|
||||
--bg-dark: #111111;
|
||||
--bg-panel: #181818;
|
||||
--bg-card: #1a1a1a;
|
||||
--radar-bg: #181818;
|
||||
--border-glow: transparent;
|
||||
--border-color: #2a2a2a;
|
||||
--grid-line: transparent;
|
||||
--noise-image: none;
|
||||
}
|
||||
|
||||
html[data-ui-tier="lean"] .scanline,
|
||||
html[data-ui-tier="lean"] .radar-bg {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@@ -1778,3 +1778,35 @@ body.embedded .panel {
|
||||
body.embedded .controls-bar {
|
||||
padding: 10px 15px;
|
||||
}
|
||||
|
||||
/* ============================================
|
||||
ENHANCED TIER — amber military console
|
||||
============================================ */
|
||||
html[data-ui-tier="enhanced"] {
|
||||
--bg-dark: #080600;
|
||||
--bg-panel: #0c0a04;
|
||||
--bg-card: #0e0b05;
|
||||
--border-glow: rgba(200, 150, 40, 0.25);
|
||||
--border-color: rgba(200, 150, 40, 0.2);
|
||||
--grid-line: rgba(200, 150, 40, 0.07);
|
||||
--accent-cyan: #c89628;
|
||||
--accent-green: #c89628;
|
||||
}
|
||||
|
||||
/* ============================================
|
||||
LEAN TIER — flat dark, no GPU effects
|
||||
============================================ */
|
||||
html[data-ui-tier="lean"] {
|
||||
--bg-dark: #111111;
|
||||
--bg-panel: #181818;
|
||||
--bg-card: #1a1a1a;
|
||||
--border-glow: transparent;
|
||||
--border-color: #2a2a2a;
|
||||
--grid-line: transparent;
|
||||
--noise-image: none;
|
||||
}
|
||||
|
||||
html[data-ui-tier="lean"] .scanline,
|
||||
html[data-ui-tier="lean"] .grid-bg {
|
||||
display: none;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user