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:
+21
-6
@@ -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 -->
|
||||
|
||||
Reference in New Issue
Block a user