Manage users on admin panel

templates/dashboard/users/form.html

@@ -0,0 +1,78 @@
+<div class="bg-white rounded-lg shadow-md border border-gray-200 mb-8">
+    <div class="p-6 border-b border-gray-200">
+        <div class="flex flex-col sm:flex-row sm:items-center sm:justify-between">
+            <div>
+                <h2 class="text-xl font-semibold text-gray-900 flex items-center">
+                    <svg class="w-5 h-5 text-green-600 mr-2"
+                         fill="none"
+                         viewBox="0 0 24 24"
+                         stroke="currentColor">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+                              d="M18 9v3m0 0v3m0-3h3m-3 0h-3m-2-5a4 4 0 11-8 0 4 4 0 018 0zM3 20a6 6 0 0112 0v1H3v-1z"/>
+                    </svg>
+                    Create a new user
+                </h2>
+                <p class="text-sm text-gray-600 mt-1">Add a new user to the system.</p>
+            </div>
+        </div>
+    </div>
+    <div class="p-6">
+        <form hx-post="/admin/users"
+              hx-target="#user-form-messages"
+              hx-swap="innerHTML"
+              class="space-y-4">
+            <div>
+                <label for="username" class="block text-sm font-medium text-gray-700 mb-1">
+                    Username
+                </label>
+                <input type="text"
+                       id="username"
+                       name="username"
+                       required
+                       class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-green-500 focus:border-green-500">
+            </div>
+
+            <div>
+                <label for="password" class="block text-sm font-medium text-gray-700 mb-1">
+                    Password
+                </label>
+                <input type="password"
+                       id="password"
+                       name="password"
+                       required
+                       minlength="12"
+                       class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-green-500 focus:border-green-500">
+            </div>
+
+            <div>
+                <label for="password_check" class="block text-sm font-medium text-gray-700 mb-1">
+                    Confirm password
+                </label>
+                <input type="password"
+                       id="password_check"
+                       name="password_check"
+                       required
+                       minlength="12"
+                       class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-green-500 focus:border-green-500">
+            </div>
+
+            <div class="flex items-center">
+                <input type="checkbox"
+                       id="admin"
+                       name="admin"
+                       value="true"
+                       class="h-4 w-4 text-green-600 focus:ring-green-500 border-gray-300 rounded">
+                <label for="admin" class="ml-2 block text-sm text-gray-700">
+                    Grant administrator privileges
+                </label>
+            </div>
+
+            <button type="submit"
+                    class="w-full bg-green-600 text-white hover:bg-green-700 font-medium py-2 px-4 rounded-md transition-colors">
+                Create
+            </button>
+
+            <div id="user-form-messages"></div>
+        </form>
+    </div>
+</div>