3 files changed, 39 insertions, 33 deletions
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">
+        {{ ui.field('username', label='Username', value=form.username if form else '', error=errors.username if errors else '') }}
-        <input type="text" name="username" {% if form %}value="{{ form.username }}"{% endif %} placeholder="username" />
+        {{ ui.field('password', type='password', label='Password', error=errors.password if errors else '') }}
-        {% if errors and errors.username %}
+        {{ ui.button('Sign in') }}
-            {{ errors.username }}
-        {% endif %}
-        <input type="password" name="password" />
-        {% if errors and errors.password%}
-            {{ errors.password }}
-        {% endif %}
-        <button type="submit">Login</button>
    </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">
+        {{ ui.field('email', type='email', label='Email', value=form.email if form else '', error=errors.email if errors else '') }}
-        <input type="email" name="email" {% if form %}value="{{ form.email }}"{% endif %} placeholder="email" />
+        {{ ui.field('password', type='password', label='Password', error=errors.password if errors else '') }}
-        {% if errors and errors.email%}
+        {{ ui.field('verify_password', type='password', label='Confirm password', error=errors.verify_password if errors else '') }}
-            {{ errors.email }}
+        {{ ui.button('Create account') }}
-        {% 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>
    </form>
-{%  endblock %}
+    <p class="auth-switch">Already have an account? <a href="/auth/login/">Sign in</a></p>
+{% endblock %}

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 @@
1	{% extends 'global.html' %}	1	{% extends 'global.html' %}
		2	{% import 'macros.html' as ui %}
2	{% block template %}	3	{% block template %}
3	{% block content %}{% endblock %}	4	<div class="auth-page">
		5	<div class="auth-shell">
		6	<div class="auth-hero">
		7	<div class="auth-hero__brand">{{ ui.connector_icon(20) }} ttun</div>
		8	<div class="auth-hero__diagram">
		9	<span class="mono">local:3000</span>
		10	<span class="connector">{{ ui.connector_icon(20) }}</span>
		11	<span class="mono">your-app.ttun.dev</span>
		12	</div>
		13	<p class="auth-hero__tagline">Self-hosted tunnel proxy. Expose a local port through a public URL you control.</p>
		14	</div>
		15	<div class="auth-form">
		16	{% block content %}{% endblock %}
		17	</div>
		18	</div>
		19	</div>
4	{% endblock %}	20	{% 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 @@
1	{% extends "./base.html" %}	1	{% extends "./base.html" %}
		2	{% import 'macros.html' as ui %}
2		3
3	{% block content %}	4	{% block content %}
		5	<h1>Sign in</h1>
		6	<p class="auth-form__intro">Enter your credentials to manage this server.</p>
4	<form method="post">	7	<form method="post">
5		8	{{ ui.field('username', label='Username', value=form.username if form else '', error=errors.username if errors else '') }}
6	<input type="text" name="username" {% if form %}value="{{ form.username }}"{% endif %} placeholder="username" />	9	{{ ui.field('password', type='password', label='Password', error=errors.password if errors else '') }}
7	{% if errors and errors.username %}	10	{{ ui.button('Sign in') }}
8	{{ errors.username }}
9	{% endif %}
10
11
12	<input type="password" name="password" />
13	{% if errors and errors.password%}
14	{{ errors.password }}
15	{% endif %}
16	<button type="submit">Login</button>
17	</form>	11	</form>
18	{% endblock %}	12	<p class="auth-switch">New here? <a href="/auth/register/">Create an account</a></p>
		13	{% 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 @@
1	{% extends "./base.html" %}	1	{% extends "./base.html" %}
		2	{% import 'macros.html' as ui %}
2		3
3	{% block content %}	4	{% block content %}
		5	{% if is_first_run %}
		6	<h1>Set up your ttun server</h1>
		7	<p class="auth-form__intro">This will be the first account, with full access to manage this server.</p>
		8	{% else %}
		9	<h1>Create your account</h1>
		10	<p class="auth-form__intro">This account will be able to sign in and manage this server.</p>
		11	{% endif %}
4	<form method="post">	12	<form method="post">
5		13	{{ ui.field('email', type='email', label='Email', value=form.email if form else '', error=errors.email if errors else '') }}
6	<input type="email" name="email" {% if form %}value="{{ form.email }}"{% endif %} placeholder="email" />	14	{{ ui.field('password', type='password', label='Password', error=errors.password if errors else '') }}
7	{% if errors and errors.email%}	15	{{ ui.field('verify_password', type='password', label='Confirm password', error=errors.verify_password if errors else '') }}
8	{{ errors.email }}	16	{{ ui.button('Create account') }}
9	{% endif %}
10
11
12	<input type="password" name="password" />
13	{% if errors and errors.password%}
14	{{ errors.password }}
15	{% endif %}
16
17	<input type="password" name="verify_password" />
18	{% if errors and errors.password%}
19	{{ errors.verify_password }}
20	{% endif %}
21
22	<button type="submit">Register</button>
23	</form>	17	</form>
24	{% endblock %}	18	<p class="auth-switch">Already have an account? <a href="/auth/login/">Sign in</a></p>
		19	{% endblock %}