FossilRepo

fossilrepo / templates / organization / role_form.html

Source Blame History 98 lines

c588255…	ragelink	1	{% extends "base.html" %}
c588255…	ragelink	2	{% block title %}{{ title }} — Fossilrepo{% endblock %}
c588255…	ragelink	3
c588255…	ragelink	4	{% block content %}
c588255…	ragelink	5	<div class="mb-6">
c588255…	ragelink	6	<a href="{% url 'organization:role_list' %}" class="text-sm text-brand-light hover:text-brand">← Back to Roles</a>
c588255…	ragelink	7	</div>
c588255…	ragelink	8
c588255…	ragelink	9	<div class="mx-auto max-w-3xl">
c588255…	ragelink	10	<h1 class="text-2xl font-bold text-gray-100 mb-6">{{ title }}</h1>
c588255…	ragelink	11
c588255…	ragelink	12	<form method="post" class="space-y-6">
c588255…	ragelink	13	{% csrf_token %}
c588255…	ragelink	14
c588255…	ragelink	15	<div class="rounded-lg bg-gray-800 p-6 shadow border border-gray-700 space-y-6">
c588255…	ragelink	16	<div>
c588255…	ragelink	17	<label for="{{ form.name.id_for_label }}" class="block text-sm font-medium text-gray-300">
c588255…	ragelink	18	Name <span class="text-red-400">*</span>
c588255…	ragelink	19	</label>
c588255…	ragelink	20	<div class="mt-1">{{ form.name }}</div>
c588255…	ragelink	21	{% if form.name.errors %}
c588255…	ragelink	22	<p class="mt-1 text-sm text-red-400">{{ form.name.errors.0 }}</p>
c588255…	ragelink	23	{% endif %}
c588255…	ragelink	24	</div>
c588255…	ragelink	25
c588255…	ragelink	26	<div>
c588255…	ragelink	27	<label for="{{ form.description.id_for_label }}" class="block text-sm font-medium text-gray-300">
c588255…	ragelink	28	Description
c588255…	ragelink	29	</label>
c588255…	ragelink	30	<div class="mt-1">{{ form.description }}</div>
c588255…	ragelink	31	{% if form.description.errors %}
c588255…	ragelink	32	<p class="mt-1 text-sm text-red-400">{{ form.description.errors.0 }}</p>
c588255…	ragelink	33	{% endif %}
c588255…	ragelink	34	</div>
c588255…	ragelink	35
c588255…	ragelink	36	<div>
c588255…	ragelink	37	<div class="flex items-center gap-3">
c588255…	ragelink	38	{{ form.is_default }}
c588255…	ragelink	39	<label for="{{ form.is_default.id_for_label }}" class="text-sm font-medium text-gray-300">
c588255…	ragelink	40	Default role
c588255…	ragelink	41	</label>
c588255…	ragelink	42	</div>
c588255…	ragelink	43	<p class="mt-1 text-sm text-gray-500">Assigned to new users automatically.</p>
c588255…	ragelink	44	</div>
c588255…	ragelink	45	</div>
c588255…	ragelink	46
c588255…	ragelink	47	<div>
c588255…	ragelink	48	<h2 class="text-lg font-semibold text-gray-100 mb-4">Permissions</h2>
c588255…	ragelink	49	{% if form.permissions.errors %}
c588255…	ragelink	50	<p class="mb-2 text-sm text-red-400">{{ form.permissions.errors.0 }}</p>
c588255…	ragelink	51	{% endif %}
c588255…	ragelink	52
c588255…	ragelink	53	<div class="grid grid-cols-1 gap-4 sm:grid-cols-2" x-data="{ selectAll(groupId) {
c588255…	ragelink	54	document.querySelectorAll('#perm-group-' + groupId + ' input[type=checkbox]').forEach(cb => cb.checked = true);
c588255…	ragelink	55	}, deselectAll(groupId) {
c588255…	ragelink	56	document.querySelectorAll('#perm-group-' + groupId + ' input[type=checkbox]').forEach(cb => cb.checked = false);
c588255…	ragelink	57	}}">
c588255…	ragelink	58	{% for category, perms in form.grouped_permissions.items %}
c588255…	ragelink	59	<div class="overflow-hidden rounded-lg border border-gray-700 bg-gray-800 shadow-sm"
c588255…	ragelink	60	id="perm-group-{{ forloop.counter }}">
c588255…	ragelink	61	<div class="bg-gray-900 px-4 py-3 flex items-center justify-between">
c588255…	ragelink	62	<h3 class="text-sm font-semibold text-gray-200">{{ category }}</h3>
c588255…	ragelink	63	<div class="flex gap-2">
c588255…	ragelink	64	<button type="button" @click="selectAll({{ forloop.counter }})"
c588255…	ragelink	65	class="text-xs text-brand-light hover:text-brand">All</button>
c588255…	ragelink	66	<span class="text-gray-600">\|</span>
c588255…	ragelink	67	<button type="button" @click="deselectAll({{ forloop.counter }})"
c588255…	ragelink	68	class="text-xs text-gray-400 hover:text-gray-200">None</button>
c588255…	ragelink	69	</div>
c588255…	ragelink	70	</div>
c588255…	ragelink	71	<div class="px-4 py-3 grid grid-cols-1 gap-2">
c588255…	ragelink	72	{% for item in perms %}
c588255…	ragelink	73	<label class="flex items-center gap-2 text-sm text-gray-300 cursor-pointer hover:text-gray-100">
c588255…	ragelink	74	<input type="checkbox" name="permissions" value="{{ item.perm.pk }}"
c588255…	ragelink	75	{% if item.checked %}checked{% endif %}
c588255…	ragelink	76	class="rounded border-gray-600 text-brand focus:ring-brand bg-gray-700">
c588255…	ragelink	77	<span>{{ item.perm.name }}</span>
c588255…	ragelink	78	</label>
c588255…	ragelink	79	{% endfor %}
c588255…	ragelink	80	</div>
c588255…	ragelink	81	</div>
c588255…	ragelink	82	{% endfor %}
c588255…	ragelink	83	</div>
c588255…	ragelink	84	</div>
c588255…	ragelink	85
c588255…	ragelink	86	<div class="flex justify-end gap-3 pt-4">
c588255…	ragelink	87	<a href="{% url 'organization:role_list' %}"
c588255…	ragelink	88	class="rounded-md bg-gray-700 px-4 py-2 text-sm font-semibold text-gray-100 shadow-sm ring-1 ring-inset ring-gray-600 hover:bg-gray-600">
c588255…	ragelink	89	Cancel
c588255…	ragelink	90	</a>
c588255…	ragelink	91	<button type="submit"
c588255…	ragelink	92	class="rounded-md bg-brand px-4 py-2 text-sm font-semibold text-white shadow-sm hover:bg-brand-hover">
c588255…	ragelink	93	{% if role %}Update{% else %}Create{% endif %}
c588255…	ragelink	94	</button>
c588255…	ragelink	95	</div>
c588255…	ragelink	96	</form>
c588255…	ragelink	97	</div>
c588255…	ragelink	98	{% endblock %}

FossilRepo

Keyboard Shortcuts