fix(admin): expandable sidebar section + library manage toggle

- Admin section in sidebar now uses same expandable panel pattern as
  Appearance and User sections (toggle button with chevron, auto-opens
  when on /admin pages)
- Library Manage button toggles open/close instead of only opening
  (uses htmx.ajax for open, clears panel for close)
This commit is contained in:
2026-08-07 23:29:01 -04:00
parent 006cc0c2c9
commit a42232e67a
5 changed files with 283 additions and 262 deletions
+21 -6
View File
@@ -122,11 +122,25 @@ templ Header(user User, currentPath string) {
}
</div>
</div>
<!-- Admin section (visible to admins only) -->
if user.Role == "admin" {
<div class="my-1.5 mx-3 border-t" style="border-color: color-mix(in srgb, var(--text-primary) 7%, transparent);"></div>
<p class="px-3 pb-1 text-xs font-medium uppercase tracking-wide" style="color: var(--text-secondary);">Administration</p>
<div class="space-y-0.5">
<!-- Admin section (visible to admins only) -->
if user.Role == "admin" {
<div x-data="{ adminOpen: window.location.pathname.startsWith('/admin') }" class="sidebar-panel">
<button
type="button"
@click="adminOpen = !adminOpen"
class="w-full flex items-center gap-3 px-3 py-2 rounded-lg text-sm font-medium transition-colors text-content-muted hover:text-content hover:bg-surface-hover"
>
@Icon("shield", "h-5 w-5 shrink-0")
<span>Administration</span>
<svg
class="h-4 w-4 ml-auto transition-transform"
:class="{ 'rotate-180': adminOpen }"
fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"
>
<path stroke-linecap="round" stroke-linejoin="round" d="M19 9l-7 7-7-7"/>
</svg>
</button>
<div x-show="adminOpen" x-cloak x-transition class="mt-1 space-y-0.5 pl-1">
<a href="/admin" class={ activeClass(currentPath, "/admin") }>
@Icon("grid", "h-5 w-5 shrink-0")
<span>Dashboard</span>
@@ -144,7 +158,8 @@ templ Header(user User, currentPath string) {
<span>Settings</span>
</a>
</div>
}
</div>
}
</div>
</aside>
<!-- Topbar -->