92 lines
2.9 KiB
Plaintext
92 lines
2.9 KiB
Plaintext
package adminview
|
|
|
|
templ RoleCreateForm() {
|
|
<!-- Modal Overlay -->
|
|
<div
|
|
class="fixed inset-0 bg-crust/80 flex items-center justify-center z-50"
|
|
@click.self="document.getElementById('role-modal').innerHTML = ''"
|
|
>
|
|
<div class="bg-surface0 border border-surface1 rounded-lg w-full max-w-md p-6">
|
|
<div class="flex justify-between items-center mb-4">
|
|
<h2 class="text-xl font-bold text-text">Create New Role</h2>
|
|
<button
|
|
class="text-subtext0 hover:text-text transition"
|
|
@click="document.getElementById('role-modal').innerHTML = ''"
|
|
>
|
|
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"></path>
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
<form
|
|
hx-post="/admin/roles/create"
|
|
hx-target="#admin-content"
|
|
hx-swap="innerHTML"
|
|
>
|
|
<div class="space-y-4">
|
|
<!-- Name Field -->
|
|
<div>
|
|
<label class="block text-sm font-semibold text-text mb-1" for="name">
|
|
Name (lowercase, no spaces)
|
|
</label>
|
|
<input
|
|
type="text"
|
|
id="name"
|
|
name="name"
|
|
required
|
|
pattern="[a-z0-9_-]+"
|
|
class="w-full px-3 py-2 bg-mantle border border-surface1 rounded text-text focus:outline-none focus:border-blue"
|
|
placeholder="e.g., moderator"
|
|
/>
|
|
<p class="text-xs text-subtext0 mt-1">Used internally, must be unique</p>
|
|
</div>
|
|
<!-- Display Name Field -->
|
|
<div>
|
|
<label class="block text-sm font-semibold text-text mb-1" for="display_name">
|
|
Display Name
|
|
</label>
|
|
<input
|
|
type="text"
|
|
id="display_name"
|
|
name="display_name"
|
|
required
|
|
class="w-full px-3 py-2 bg-mantle border border-surface1 rounded text-text focus:outline-none focus:border-blue"
|
|
placeholder="e.g., Moderator"
|
|
/>
|
|
<p class="text-xs text-subtext0 mt-1">Human-readable name shown in UI</p>
|
|
</div>
|
|
<!-- Description Field -->
|
|
<div>
|
|
<label class="block text-sm font-semibold text-text mb-1" for="description">
|
|
Description
|
|
</label>
|
|
<textarea
|
|
id="description"
|
|
name="description"
|
|
rows="3"
|
|
class="w-full px-3 py-2 bg-mantle border border-surface1 rounded text-text focus:outline-none focus:border-blue resize-none"
|
|
placeholder="Brief description of this role's purpose"
|
|
></textarea>
|
|
</div>
|
|
<!-- Action Buttons -->
|
|
<div class="flex justify-end space-x-2 pt-2">
|
|
<button
|
|
type="button"
|
|
class="px-4 py-2 bg-surface1 text-text rounded hover:bg-surface2 transition"
|
|
@click="document.getElementById('role-modal').innerHTML = ''"
|
|
>
|
|
Cancel
|
|
</button>
|
|
<button
|
|
type="submit"
|
|
class="px-4 py-2 bg-blue text-mantle rounded font-semibold hover:bg-sky transition"
|
|
>
|
|
Create Role
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
}
|