From 2d22158dd95f76399f5716d556be60c77da04a46 Mon Sep 17 00:00:00 2001
From: Tom van der Lee <tom@vanderlee.io>
Date: Thu, 30 Jul 2026 16:03:32 +0200
Subject: Admin ui

---
 authentication/templates/base.html     | 18 +++++++++++++++++-
 authentication/templates/login.html    | 21 ++++++++-------------
 authentication/templates/register.html | 33 ++++++++++++++-------------------
 3 files changed, 39 insertions(+), 33 deletions(-)

(limited to 'authentication/templates')

diff --git a/authentication/templates/base.html b/authentication/templates/base.html
index 9874313..ae6cb64 100644
--- a/authentication/templates/base.html
+++ b/authentication/templates/base.html
@@ -1,4 +1,20 @@
 {% extends 'global.html' %}
+{% import 'macros.html' as ui %}
 {% block template %}
-    {% block content %}{% endblock %}
+<div class="auth-page">
+    <div class="auth-shell">
+        <div class="auth-hero">
+            <div class="auth-hero__brand">{{ ui.connector_icon(20) }} ttun</div>
+            <div class="auth-hero__diagram">
+                <span class="mono">local:3000</span>
+                <span class="connector">{{ ui.connector_icon(20) }}</span>
+                <span class="mono">your-app.ttun.dev</span>
+            </div>
+            <p class="auth-hero__tagline">Self-hosted tunnel proxy. Expose a local port through a public URL you control.</p>
+        </div>
+        <div class="auth-form">
+            {% block content %}{% endblock %}
+        </div>
+    </div>
+</div>
 {% endblock %}
diff --git a/authentication/templates/login.html b/authentication/templates/login.html
index 2db2512..dcc0efd 100644
--- a/authentication/templates/login.html
+++ b/authentication/templates/login.html
@@ -1,18 +1,13 @@
 {% extends "./base.html" %}
+{% import 'macros.html' as ui %}
 
 {% block content %}
+    <h1>Sign in</h1>
+    <p class="auth-form__intro">Enter your credentials to manage this server.</p>
     <form method="post">
-
-        <input type="text" name="username" {% if form %}value="{{ form.username }}"{% endif %} placeholder="username" />
-        {% if errors and errors.username %}
-            {{ errors.username }}
-        {% endif %}
-
-
-        <input type="password" name="password" />
-        {% if errors and errors.password%}
-            {{ errors.password }}
-        {% endif %}
-        <button type="submit">Login</button>
+        {{ ui.field('username', label='Username', value=form.username if form else '', error=errors.username if errors else '') }}
+        {{ ui.field('password', type='password', label='Password', error=errors.password if errors else '') }}
+        {{ ui.button('Sign in') }}
     </form>
-{%  endblock %}
+    <p class="auth-switch">New here? <a href="/auth/register/">Create an account</a></p>
+{% endblock %}
diff --git a/authentication/templates/register.html b/authentication/templates/register.html
index 576db78..a1959eb 100644
--- a/authentication/templates/register.html
+++ b/authentication/templates/register.html
@@ -1,24 +1,19 @@
 {% extends "./base.html" %}
+{% import 'macros.html' as ui %}
 
 {% block content %}
+    {% if is_first_run %}
+        <h1>Set up your ttun server</h1>
+        <p class="auth-form__intro">This will be the first account, with full access to manage this server.</p>
+    {% else %}
+        <h1>Create your account</h1>
+        <p class="auth-form__intro">This account will be able to sign in and manage this server.</p>
+    {% endif %}
     <form method="post">
-
-        <input type="email" name="email" {% if form %}value="{{ form.email }}"{% endif %} placeholder="email" />
-        {% if errors and errors.email%}
-            {{ errors.email }}
-        {% endif %}
-
-
-        <input type="password" name="password" />
-        {% if errors and errors.password%}
-            {{ errors.password }}
-        {% endif %}
-
-        <input type="password" name="verify_password" />
-        {% if errors and errors.password%}
-            {{ errors.verify_password }}
-        {% endif %}
-
-        <button type="submit">Register</button>
+        {{ ui.field('email', type='email', label='Email', value=form.email if form else '', error=errors.email if errors else '') }}
+        {{ ui.field('password', type='password', label='Password', error=errors.password if errors else '') }}
+        {{ ui.field('verify_password', type='password', label='Confirm password', error=errors.verify_password if errors else '') }}
+        {{ ui.button('Create account') }}
     </form>
-{%  endblock %}
+    <p class="auth-switch">Already have an account? <a href="/auth/login/">Sign in</a></p>
+{% endblock %}
-- 
cgit v1.2.3