Apply the new design-system primitives across the remaining pages so the whole app shares one visual language: - Auth/entry: redesigned index, login, register (centered card layout, SVG icons, semantic tokens) - Admin: sidebar nav with icons, cohesive admin dashboard/users/library/ processing-issues/settings (tables use border-line + hover states; scan/websocket attributes preserved) - Secondary: analytics (stat cards), devices, progress, conflicts, queue, profile + form/modal all migrated to .card/.btn/.input primitives and SVG action icons - Docs + API explorer + setup wizard + collection/rules/modals + unlinked books + book-detail modals: consistent chrome, modal scrims use --surface-overlay, close buttons use icon-btn - reader.templ and error.templ intentionally left unchanged
29 lines
922 B
Templ
29 lines
922 B
Templ
package templates
|
|
|
|
templ ProfileModal(user User) {
|
|
<div id="profile-modal" class="fixed inset-0 flex items-center justify-center z-50" x-data="profileModal" x-init="setupProfileModal()" style="background-color: var(--surface-overlay);">
|
|
<div class="card max-w-4xl w-full mx-4 max-h-[90vh] overflow-y-auto">
|
|
<!-- Modal Header -->
|
|
<div class="flex justify-between items-center p-6 border-b border-line">
|
|
<div>
|
|
<h2 class="text-2xl font-bold tracking-tight text-content">Edit User Profile</h2>
|
|
<p class="text-sm mt-1 text-content-muted">
|
|
{ user.Username } ({ user.Email })
|
|
</p>
|
|
</div>
|
|
<button
|
|
@click="closeProfileModal()"
|
|
class="btn btn-ghost"
|
|
>
|
|
@Icon("close", "h-5 w-5")
|
|
</button>
|
|
</div>
|
|
|
|
<!-- Modal Body - uses reusable form -->
|
|
<div class="p-6">
|
|
@ProfileForm(user, "/api/auth/profile/" + user.ID, false, true, true)
|
|
</div>
|
|
</div>
|
|
</div>
|
|
}
|