mirror of
https://github.com/smittix/intercept.git
synced 2026-06-08 14:11:54 -07:00
feat: add lean/enhanced layout overrides; retire data-animations CSS
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
+88
-13
@@ -1041,19 +1041,6 @@
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
|
||||
/* Effects/animations toggle icon states */
|
||||
.nav-tool-btn .icon-effects-off {
|
||||
display: none;
|
||||
}
|
||||
|
||||
[data-animations="off"] .nav-tool-btn .icon-effects-on {
|
||||
display: none;
|
||||
}
|
||||
|
||||
[data-animations="off"] .nav-tool-btn .icon-effects-off {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
/* Dashboard Button in Nav */
|
||||
a.nav-dashboard-btn,
|
||||
a.nav-dashboard-btn:link,
|
||||
@@ -1172,3 +1159,91 @@ a.nav-dashboard-btn:hover {
|
||||
background: rgba(220, 230, 244, 0.9);
|
||||
box-shadow: var(--shadow-sm);
|
||||
}
|
||||
|
||||
/* ============================================
|
||||
LEAN TIER — flat nav and header
|
||||
============================================ */
|
||||
[data-ui-tier="lean"] .mode-nav {
|
||||
background: #181818;
|
||||
backdrop-filter: none;
|
||||
-webkit-backdrop-filter: none;
|
||||
}
|
||||
|
||||
[data-ui-tier="lean"] .mode-nav::after,
|
||||
[data-ui-tier="lean"] .app-header::after,
|
||||
[data-ui-tier="lean"] .mobile-nav::after,
|
||||
[data-ui-tier="lean"] .dashboard-header::after {
|
||||
display: none;
|
||||
}
|
||||
|
||||
[data-ui-tier="lean"] .app-header {
|
||||
background: #181818;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
[data-ui-tier="lean"] .mode-nav-dropdown-menu {
|
||||
backdrop-filter: none;
|
||||
-webkit-backdrop-filter: none;
|
||||
background: #202020;
|
||||
}
|
||||
|
||||
/* ============================================
|
||||
ENHANCED TIER — amber console nav framing
|
||||
============================================ */
|
||||
[data-ui-tier="enhanced"] .mode-nav {
|
||||
background: linear-gradient(180deg, rgba(14, 11, 3, 0.95), rgba(8, 6, 0, 0.92));
|
||||
}
|
||||
|
||||
[data-ui-tier="enhanced"] .mode-nav::after,
|
||||
[data-ui-tier="enhanced"] .app-header::after,
|
||||
[data-ui-tier="enhanced"] .dashboard-header::after {
|
||||
background: linear-gradient(90deg, transparent, var(--accent-cyan), transparent);
|
||||
}
|
||||
|
||||
[data-ui-tier="enhanced"] .mode-nav-btn.active {
|
||||
background: rgba(200, 150, 40, 0.08);
|
||||
color: var(--accent-cyan);
|
||||
border-left: 2px solid var(--accent-cyan);
|
||||
box-shadow: -2px 0 8px rgba(200, 150, 40, 0.15);
|
||||
padding-left: 12px;
|
||||
}
|
||||
|
||||
[data-ui-tier="enhanced"] .nav-clock .utc-time {
|
||||
color: var(--accent-cyan);
|
||||
text-shadow: 0 0 8px rgba(200, 150, 40, 0.3);
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
[data-ui-tier="enhanced"] .mode-nav-btn .nav-label,
|
||||
[data-ui-tier="enhanced"] .mode-nav-label {
|
||||
font-family: var(--font-mono);
|
||||
letter-spacing: 2px;
|
||||
}
|
||||
|
||||
/* Tier toggle button — label visibility */
|
||||
.nav-tier-btn .tier-label-lean { display: none; }
|
||||
.nav-tier-btn .tier-label-enhanced { display: none; }
|
||||
[data-ui-tier="lean"] .nav-tier-btn .tier-label-lean { display: inline; }
|
||||
[data-ui-tier="enhanced"] .nav-tier-btn .tier-label-enhanced { display: inline; }
|
||||
|
||||
/* Tier toggle — icon visibility */
|
||||
.nav-tier-btn .icon-tier-lean { display: flex; }
|
||||
.nav-tier-btn .icon-tier-enhanced { display: none; }
|
||||
[data-ui-tier="lean"] .nav-tier-btn .icon-tier-lean { display: flex; }
|
||||
[data-ui-tier="lean"] .nav-tier-btn .icon-tier-enhanced { display: none; }
|
||||
[data-ui-tier="enhanced"] .nav-tier-btn .icon-tier-lean { display: none; }
|
||||
[data-ui-tier="enhanced"] .nav-tier-btn .icon-tier-enhanced { display: flex; }
|
||||
|
||||
/* Enhanced tier toggle button styling */
|
||||
[data-ui-tier="enhanced"] .nav-tier-btn {
|
||||
background: rgba(200, 150, 40, 0.10);
|
||||
border-color: rgba(200, 150, 40, 0.4);
|
||||
color: #c89628;
|
||||
box-shadow: 0 0 8px rgba(200, 150, 40, 0.08);
|
||||
text-shadow: 0 0 6px rgba(200, 150, 40, 0.3);
|
||||
}
|
||||
|
||||
[data-ui-tier="enhanced"] .nav-tier-btn:hover {
|
||||
background: rgba(200, 150, 40, 0.16);
|
||||
border-color: rgba(200, 150, 40, 0.6);
|
||||
}
|
||||
|
||||
@@ -7317,39 +7317,6 @@ body::before {
|
||||
transform: rotate(-90deg);
|
||||
}
|
||||
|
||||
[data-animations="off"] .nav-tool-btn .icon-effects-on {
|
||||
opacity: 0;
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
|
||||
[data-animations="off"] .nav-tool-btn .icon-effects-off {
|
||||
opacity: 1;
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
/* Disable cosmetic animations when toggled off */
|
||||
[data-animations="off"] .globe-svg,
|
||||
[data-animations="off"] .rotating-meridians,
|
||||
[data-animations="off"] .meridian-1,
|
||||
[data-animations="off"] .meridian-2,
|
||||
[data-animations="off"] .meridian-3,
|
||||
[data-animations="off"] .welcome-scanline,
|
||||
[data-animations="off"] .landing-scanline,
|
||||
[data-animations="off"] .scanline,
|
||||
[data-animations="off"] .signal-wave,
|
||||
[data-animations="off"] .signal-wave-1,
|
||||
[data-animations="off"] .signal-wave-2,
|
||||
[data-animations="off"] .signal-wave-3,
|
||||
[data-animations="off"] .logo-dot,
|
||||
[data-animations="off"] .welcome-logo {
|
||||
animation: none !important;
|
||||
}
|
||||
|
||||
[data-animations="off"] body::before,
|
||||
[data-animations="off"] .visuals-container::after {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* ============================================
|
||||
VISUAL REFRESH OVERRIDES
|
||||
============================================ */
|
||||
@@ -7687,10 +7654,6 @@ body[data-mode="tscm"] {
|
||||
box-shadow: 0 10px 24px rgba(18, 40, 66, 0.08);
|
||||
}
|
||||
|
||||
[data-animations="off"] .mode-content.active {
|
||||
animation: none !important;
|
||||
}
|
||||
|
||||
@media (max-width: 1023px) {
|
||||
.run-state-strip {
|
||||
margin-left: 8px;
|
||||
|
||||
Reference in New Issue
Block a user