Spaces:
Sleeping
Sleeping
File size: 3,189 Bytes
c682b53 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 | /* ============================================================
Modernist theme for the main left sidebar (navbar_dda.html) —
shared, identical partial injected into every page, so this
reskin applies globally rather than being scoped to one page.
Reuses the shared --dm-* tokens declared once at :root in
dda.css: flat surfaces, hairline dividers, sharp corners, one
accent color, Archivo for the brand/nav. Pure visual restyle —
the DB-driven menu structure, RBAC, and every id/class app.js/
notifications.js select on are untouched.
============================================================ */
.dda-sidebar-nav {
background: var(--dm-bg);
border-right: 2px solid var(--dm-line);
}
/* --- Brand --- */
.dda-sidebar-brand > svg { color: var(--dm-accent); }
.dda-sidebar-brand-name {
font-family: var(--dm-font);
font-weight: 800;
font-size: 1rem;
letter-spacing: 0.02em;
background: none;
-webkit-background-clip: initial;
background-clip: initial;
color: var(--dm-ink);
}
.dda-sidebar-brand-sub { color: var(--dm-ink-muted); text-transform: uppercase; letter-spacing: 0.05em; font-size: 0.68rem; }
.dda-sidebar-toggle { border-color: var(--dm-line); border-radius: 0; color: var(--dm-ink-muted); }
.dda-sidebar-toggle:hover { background: var(--dm-accent-100); color: var(--dm-accent); }
/* --- Nav tabs --- */
.dda-tab {
border-radius: 0;
border-left: 2px solid transparent;
color: var(--dm-ink);
font-weight: 500;
}
.dda-tab:hover { background: var(--dm-bg); color: var(--dm-ink); }
.dda-tab.active {
background: var(--dm-accent-100);
border-left-color: var(--dm-accent);
color: var(--dm-accent);
font-weight: 700;
}
.dda-subtab { color: var(--dm-ink); font-weight: 500; }
.dda-subtab.active {
background: var(--dm-accent-100);
border-left-color: var(--dm-accent);
color: var(--dm-accent);
font-weight: 700;
}
.dda-sidebar-submenu { border-left-color: var(--dm-line); }
.dda-sidebar-group > summary.dda-tab-group { border-radius: 0; }
/* --- Footer: notifications + user menu --- */
.dda-sidebar-footer { border-top-color: var(--dm-line); }
.dda-notify-btn { border-color: var(--dm-line); border-radius: 0; color: var(--dm-ink); }
.dda-notify-btn:hover { background: var(--dm-accent-100); color: var(--dm-accent); }
.dda-notify-badge { background: var(--dm-accent); border-radius: 0; }
.dda-notify-panel { border-radius: 0; border-color: var(--dm-line); background: var(--dm-surface); }
.dda-notify-item { border-radius: 0; }
.dda-notify-item:hover { background: var(--dm-bg); }
.dda-notify-item.unread { background: var(--dm-accent-100); }
.dda-user-avatar {
border-radius: 0;
background: var(--dm-ink);
}
.dda-user-wrap #dda-user-email { color: var(--dm-ink); }
.dda-user-menu-panel { border-top-color: var(--dm-line); }
.dda-user-menu-link { border-radius: 0; color: var(--dm-ink); }
.dda-user-menu-link:hover { background: var(--dm-accent-100); color: var(--dm-accent); }
.dda-user-menu-link.active { color: var(--dm-accent); font-weight: 700; }
.dda-sidebar-nav.collapsed .dda-user-menu-panel { border-radius: 0; border-color: var(--dm-line); background: var(--dm-surface); box-shadow: none; }
|