Redesign admin sidebar: collapsible categories, icons, role-accurate nav

Regroup the flat 12-link staff sidebar into collapsible category sections
(Content / Moderation / System, with Dashboard and Account ungrouped) and
add a small inline-SVG icon per item. Category collapse state persists in
localStorage and the group holding the active route auto-opens.

Gate each item by role to match server-side enforcement so the sidebar no
longer shows links that would 403: Content is admin/editor, Moderation is
admin/moderator, System (Users, Settings, Hero Editor, Authentication,
Discord Bot, Web Bot Activity) is admin-only. Existing moderator confinement
(Moderation + Account only, plus redirect) is preserved.

Rename "Bot Activity" to "Web Bot Activity" to distinguish the bot-scoring
view from the Discord Bot.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
2026-07-07 21:54:37 -05:00
parent 5da27879e5
commit 17d42cebfe
2 changed files with 218 additions and 37 deletions

View File

@@ -688,6 +688,47 @@ button[disabled] {
grid-template-columns: 1fr;
}
}
/* Admin sidebar — collapsible category sections */
.admin-nav-group {
display: flex;
flex-direction: column;
gap: 4px;
margin-top: 6px;
}
.admin-nav-head {
display: flex;
align-items: center;
justify-content: space-between;
width: 100%;
padding: 6px 14px 4px;
border: 0;
background: transparent;
color: var(--dim);
font-size: 0.66rem;
letter-spacing: 0.14em;
text-transform: uppercase;
cursor: pointer;
transition: color 0.15s;
}
.admin-nav-head:hover {
color: var(--muted);
}
.admin-nav-chev {
transition: transform 0.15s ease;
flex: 0 0 auto;
}
.admin-nav-items {
padding-left: 6px;
}
.admin-nav-link > span {
min-width: 0;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.admin-nav-link svg {
flex: 0 0 16px;
}
.wiki-grid {
display: grid;
grid-template-columns: 230px 1fr;