From 0150c19b75d284373013eb52efdb5c52146dbdc9 Mon Sep 17 00:00:00 2001
From: Ian Roddis <31021769+iroddis@users.noreply.github.com>
Date: Thu, 16 Jul 2026 22:10:36 -0300
Subject: [PATCH] Making login screen a bit clearer

---
 app/static/css/style.css | 38 +++++++++++++++++++++++
 app/templates/login.html | 66 ++++++++++++++++++++++++++--------------
 app/web/pages.py         |  5 ++-
 3 files changed, 83 insertions(+), 26 deletions(-)

diff --git a/app/static/css/style.css b/app/static/css/style.css
index fb41736..6c1f7ca 100644
--- a/app/static/css/style.css
+++ b/app/static/css/style.css
@@ -607,6 +607,44 @@ textarea:focus {
   margin-bottom: 0.75rem;
 }
 
+.local-login-panel {
+  margin-top: 1.25rem;
+  border-top: 1px solid var(--border);
+  padding-top: 1rem;
+}
+
+.local-login-panel summary {
+  cursor: pointer;
+  color: var(--muted);
+  font-size: 0.875rem;
+  user-select: none;
+  list-style: none;
+  display: flex;
+  align-items: center;
+  gap: 0.4rem;
+}
+
+.local-login-panel summary::-webkit-details-marker { display: none; }
+
+.local-login-panel summary::before {
+  content: '›';
+  font-size: 1.1em;
+  transition: transform 0.15s;
+  display: inline-block;
+}
+
+.local-login-panel[open] summary::before {
+  transform: rotate(90deg);
+}
+
+.local-login-panel summary:hover {
+  color: var(--text);
+}
+
+.local-login-panel form {
+  margin-top: 1rem;
+}
+
 /* ─── Light theme ────────────────────────────────────────────────────────── */
 @media (prefers-color-scheme: light) {
   :root {
diff --git a/app/templates/login.html b/app/templates/login.html
index d740062..ee71fce 100644
--- a/app/templates/login.html
+++ b/app/templates/login.html
@@ -2,31 +2,51 @@
 {% block title %}Sign in · {{ app_name }}{% endblock %}
 {% block body %}
 <div class="auth-shell">
-  <form class="card auth-card" method="post" action="/login">
+  <div class="card auth-card">
     <h1>{{ app_name }}</h1>
     <p class="muted">Sign in to continue</p>
-    {% if error %}<div class="alert">{{ error }}</div>{% endif %}
-    <label>Email
-      <input type="email" name="email" value="{{ email or '' }}" required autofocus>
-    </label>
-    <label>Password
-      <input type="password" name="password" required>
-    </label>
-    <button type="submit" class="btn btn-primary">Sign in</button>
-  </form>
 
-  {% if ldap_enabled %}
-  <form class="card auth-card" method="post" action="/login/ldap">
-    <h2>Sign in with LDAP</h2>
-    <p class="muted">Use your directory username and password</p>
-    <label>Username
-      <input type="text" name="username" value="{{ username or '' }}" required>
-    </label>
-    <label>Password
-      <input type="password" name="password" required>
-    </label>
-    <button type="submit" class="btn btn-primary">Sign in with LDAP</button>
-  </form>
-  {% endif %}
+    {% if ldap_enabled %}
+
+      <form method="post" action="/login/ldap">
+        {% if ldap_error %}<div class="alert">{{ ldap_error }}</div>{% endif %}
+        <label>Username
+          <input type="text" name="username" value="{{ username or '' }}" required autofocus>
+        </label>
+        <label>Password
+          <input type="password" name="password" required>
+        </label>
+        <button type="submit" class="btn btn-primary">Sign in</button>
+      </form>
+
+      <details class="local-login-panel" {% if local_error %}open{% endif %}>
+        <summary>Use a local account instead</summary>
+        <form method="post" action="/login">
+          {% if local_error %}<div class="alert">{{ local_error }}</div>{% endif %}
+          <label>Email
+            <input type="email" name="email" value="{{ email or '' }}" required>
+          </label>
+          <label>Password
+            <input type="password" name="password" required>
+          </label>
+          <button type="submit" class="btn btn-primary">Sign in with local account</button>
+        </form>
+      </details>
+
+    {% else %}
+
+      <form method="post" action="/login">
+        {% if local_error %}<div class="alert">{{ local_error }}</div>{% endif %}
+        <label>Email
+          <input type="email" name="email" value="{{ email or '' }}" required autofocus>
+        </label>
+        <label>Password
+          <input type="password" name="password" required>
+        </label>
+        <button type="submit" class="btn btn-primary">Sign in</button>
+      </form>
+
+    {% endif %}
+  </div>
 </div>
 {% endblock %}
diff --git a/app/web/pages.py b/app/web/pages.py
index 8658453..2d8ea2b 100644
--- a/app/web/pages.py
+++ b/app/web/pages.py
@@ -50,12 +50,11 @@ async def login_submit(
 ):
     user = await user_crud.authenticate(db, email, password)
     if user is None:
-        # Re-render the form with an error (HTMX swaps the form partial).
         return templates.TemplateResponse(
             request,
             "login.html",
             {
-                "error": "Incorrect email or password",
+                "local_error": "Incorrect email or password",
                 "email": email,
                 "ldap_enabled": settings.ldap_enabled,
             },
@@ -82,7 +81,7 @@ async def login_ldap_submit(
             request,
             "login.html",
             {
-                "error": "LDAP sign-in failed",
+                "ldap_error": "Incorrect username or password",
                 "username": username,
                 "ldap_enabled": True,
             },