refactor(admin): integrate reusable sidebar into admin pages
- Update admin.templ to use @AdminSidebar component - Update admin_library.templ to use @AdminSidebar component - Update admin_users.templ to use @AdminSidebar component - Add sidebar layout wrapper to admin_users.templ (previously missing) - Fix theme rendering to use user.Theme in all admin templates - Remove duplicated sidebar markup across admin pages
This commit is contained in:
+1
-17
@@ -14,23 +14,7 @@ templ Admin(user User) {
|
|||||||
@Header(user, "/admin")
|
@Header(user, "/admin")
|
||||||
|
|
||||||
<div class="flex min-h-screen" style="background-color: var(--bg-primary)">
|
<div class="flex min-h-screen" style="background-color: var(--bg-primary)">
|
||||||
<aside class="w-64 border-r" style="background-color: var(--bg-secondary); border-color: var(--border)">
|
@AdminSidebar(user, "/admin")
|
||||||
<div class="p-6">
|
|
||||||
<h2 class="text-lg font-semibold mb-6" style="color: var(--text-primary)">Admin Panel</h2>
|
|
||||||
<nav class="space-y-2">
|
|
||||||
<a href="/admin" class="block px-4 py-2 rounded-lg bg-accent text-bg-primary" style="color: var(--text-primary)">
|
|
||||||
🏠 Dashboard
|
|
||||||
</a>
|
|
||||||
<a href="/admin/users" class="block px-4 py-2 rounded-lg hover:opacity-80" style="color: var(--text-primary)">
|
|
||||||
👤 User Administration
|
|
||||||
</a>
|
|
||||||
<a href="/admin/library" class="block px-4 py-2 rounded-lg hover:opacity-80" style="color: var(--text-primary)">
|
|
||||||
📚 Library Management
|
|
||||||
</a>
|
|
||||||
</nav>
|
|
||||||
</div>
|
|
||||||
</aside>
|
|
||||||
|
|
||||||
<main class="flex-1 p-8">
|
<main class="flex-1 p-8">
|
||||||
<div class="max-w-4xl">
|
<div class="max-w-4xl">
|
||||||
<div class="mb-8">
|
<div class="mb-8">
|
||||||
|
|||||||
@@ -8,25 +8,10 @@ templ AdminLibrary(user User, libraries []LibraryData, users []User) {
|
|||||||
<title>Library Management - Bookhoard</title>
|
<title>Library Management - Bookhoard</title>
|
||||||
<link href="/static/style.css" rel="stylesheet"/>
|
<link href="/static/style.css" rel="stylesheet"/>
|
||||||
</head>
|
</head>
|
||||||
<body class="theme-tokyo-night">
|
<body class="theme-{ user.Theme }">
|
||||||
@Header(user, "/admin/library")
|
@Header(user, "/admin/library")
|
||||||
<div class="flex min-h-screen" style="background-color: var(--bg-primary)">
|
<div class="flex min-h-screen" style="background-color: var(--bg-primary)">
|
||||||
<aside class="w-64 border-r" style="background-color: var(--bg-secondary); border-color: var(--border)">
|
@AdminSidebar(user, "/admin/library")
|
||||||
<div class="p-6">
|
|
||||||
<h2 class="text-lg font-semibold mb-6" style="color: var(--text-primary)">Admin Panel</h2>
|
|
||||||
<nav class="space-y-2">
|
|
||||||
<a href="/admin" class="block px-4 py-2 rounded-lg hover:opacity-80" style="color: var(--text-primary)">
|
|
||||||
🏠 Dashboard
|
|
||||||
</a>
|
|
||||||
<a href="/admin/profile" class="block px-4 py-2 rounded-lg hover:opacity-80" style="color: var(--text-primary)">
|
|
||||||
👤 Profile Settings
|
|
||||||
</a>
|
|
||||||
<a href="/admin/library" class="block px-4 py-2 rounded-lg bg-accent text-bg-primary" style="color: var(--text-primary)">
|
|
||||||
📚 Library Management
|
|
||||||
</a>
|
|
||||||
</nav>
|
|
||||||
</div>
|
|
||||||
</aside>
|
|
||||||
<main class="flex-1 p-8">
|
<main class="flex-1 p-8">
|
||||||
<div class="max-w-6xl">
|
<div class="max-w-6xl">
|
||||||
<div class="mb-8">
|
<div class="mb-8">
|
||||||
|
|||||||
@@ -12,14 +12,17 @@ templ AdminUsers(currentUser User, users []User, adminCount int) {
|
|||||||
<script src="/static/theme.js"></script>
|
<script src="/static/theme.js"></script>
|
||||||
<link href="/static/style.css" rel="stylesheet">
|
<link href="/static/style.css" rel="stylesheet">
|
||||||
</head>
|
</head>
|
||||||
<body class="theme-tokyo-night">
|
<body class="theme-{ currentUser.Theme }">
|
||||||
@Header(currentUser, "/admin/users")
|
@Header(currentUser, "/admin/users")
|
||||||
|
|
||||||
<!-- Modal Container (populated by HTMX) -->
|
<!-- Modal Container (populated by HTMX) -->
|
||||||
<div id="modal-container"></div>
|
<div id="modal-container"></div>
|
||||||
|
|
||||||
<main class="max-w-7xl mx-auto px-4 py-8">
|
<div class="flex min-h-screen" style="background-color: var(--bg-primary)">
|
||||||
<div class="mb-8">
|
@AdminSidebar(currentUser, "/admin/users")
|
||||||
|
|
||||||
|
<main class="flex-1 p-8">
|
||||||
|
<div class="max-w-7xl">
|
||||||
<h1 class="text-3xl font-bold mb-2" style="color: var(--text-primary)">User Management</h1>
|
<h1 class="text-3xl font-bold mb-2" style="color: var(--text-primary)">User Management</h1>
|
||||||
<p style="color: var(--text-secondary)">Manage user accounts and permissions</p>
|
<p style="color: var(--text-secondary)">Manage user accounts and permissions</p>
|
||||||
</div>
|
</div>
|
||||||
@@ -136,6 +139,7 @@ templ AdminUsers(currentUser User, users []User, adminCount int) {
|
|||||||
</table>
|
</table>
|
||||||
</div>
|
</div>
|
||||||
</main>
|
</main>
|
||||||
|
</div>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user