chore(dashboard): prune dead sidebar + orphaned login CSS from site.css

Removed the dead .sidebar nav block (replaced by the kit's .side-rail shell) and
the orphaned .dashboard-login/.login-card rules (the /login page now uses the
kit's <LoginCard>). Kept .app-bar (still used by the /denied page header) and the
.chip white-space override (emitted by StatusPill); corrected the now-stale
app-bar comment. 106 lines removed; builds clean.
This commit is contained in:
Joseph Doherty
2026-06-03 04:37:23 -04:00
parent 73e54e252d
commit 5539ec8542
@@ -9,108 +9,13 @@
body.dashboard-body { min-height: 100vh; }
/* ── App bar ─────────────────────────────────────────────────────────────────
theme.css styles .app-bar / .brand / .mark / .spacer. Here we centre the row
and add the meta cluster. Navigation lives in the side rail below. */
The kit's theme.css styles .app-bar / .brand / .mark / .spacer; these rules
centre the row and tweak the brand. Used by the minimal /denied page header —
the main dashboard's navigation lives in the kit side-rail shell (ThemeShell). */
.app-bar { align-items: center; gap: 1rem; }
.app-bar .brand { color: var(--ink); }
.app-bar .brand:hover { text-decoration: none; }
/* ── Sidebar ─────────────────────────────────────────────────────────────────
Left-rail navigation. Pattern lifted from ScadaLink CentralUI: a fixed-width
sidebar that hosts the brand at the top, a scrollable nav region with
collapsible NavSections in the middle, and a sign-in/out footer at the
bottom. The sidebar is wrapped in a Bootstrap .collapse so a hamburger
button can show/hide it on <lg viewports. */
.sidebar {
min-width: 220px;
max-width: 220px;
height: 100vh;
background: var(--card);
border-right: 1px solid var(--rule-strong);
}
/* Pin the sidebar to the viewport on lg+ so it stays visible when the main
content scrolls past 100vh. The wrapper is the flex child of MainLayout;
align-self prevents the flex row from stretching it. */
@media (min-width: 992px) {
#sidebar-collapse {
position: sticky;
top: 0;
height: 100vh;
align-self: flex-start;
z-index: 1020;
}
}
/* When collapsed under <lg viewports the Bootstrap collapse container removes
the fixed width; restore full width on mobile. */
@media (max-width: 991.98px) {
.sidebar {
min-width: 100%;
max-width: 100%;
height: auto;
}
}
.sidebar .brand {
display: block;
color: var(--ink);
font-size: 1.1rem;
font-weight: 600;
letter-spacing: 0.02em;
padding: 1rem;
border-bottom: 1px solid var(--rule);
text-decoration: none;
}
.sidebar .brand:hover { text-decoration: none; }
.sidebar .brand .mark { color: var(--accent); }
.sidebar .nav-link {
color: var(--ink-soft);
padding: 0.4rem 1rem;
font-size: 0.9rem;
}
.sidebar .nav-link:hover {
color: var(--ink);
background-color: var(--paper);
text-decoration: none;
}
.sidebar .nav-link.active {
color: var(--accent-deep);
background-color: var(--paper);
font-weight: 600;
/* Left accent so active state isn't carried by colour alone. */
border-left: 3px solid var(--accent);
padding-left: calc(1rem - 3px);
}
/* Collapsible section header — a full-width button styled as an uppercase
eyebrow with a leading expand/collapse chevron. */
.sidebar .nav-section-toggle {
display: flex;
align-items: center;
gap: 0.4rem;
width: 100%;
background: none;
border: 0;
cursor: pointer;
text-align: left;
color: var(--ink-faint);
font-size: 0.7rem;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.07em;
padding: 0.75rem 1rem 0.25rem;
margin-top: 0.5rem;
}
.sidebar .nav-section-toggle:hover { color: var(--ink); }
.sidebar .nav-section-toggle .chevron {
display: inline-block;
width: 0.8rem;
font-size: 0.8rem;
line-height: 1;
}
/* ── Page header ─────────────────────────────────────────────────────────────
h1 in sans, the sub-line in monospace as a quiet meta crumb. */
.dashboard-page-header {
@@ -337,14 +242,6 @@ code {
.alert-success { color: var(--ok); background: var(--ok-bg); border-color: #c6e6cd; }
.alert-danger { color: var(--bad); background: var(--bad-bg); border-color: #eec3c3; }
/* ── Login ───────────────────────────────────────────────────────────────────*/
.dashboard-login { max-width: 24rem; margin: 0 auto; }
.login-card {
background: var(--card);
border: 1px solid var(--rule);
border-radius: 8px;
}
/* ── API key management ──────────────────────────────────────────────────────*/
.api-key-management-grid {
display: grid;