feat(ui): integrate login with shared auth shell

2026-08-15 01:04:25 +07:00
parent 906ec6bea4
commit f48fc63775
4 changed files with 49 additions and 20 deletions
@@ -1,18 +1,19 @@
 <!doctype html>
-<html lang="en" xmlns:th="http://www.thymeleaf.org">
-<head><meta charset="utf-8"><title>Sign in · Lab Timesheet</title></head>
+<html lang="en" xmlns:th="http://www.thymeleaf.org"
+      th:replace="~{fragments/auth-layout :: shell(
+          pageTitle='Sign in',
+          eyebrow='Lab Timesheet',
+          content=~{::main})}">
 <body>
 <main>
-  <h1>Sign in</h1>
-  <p th:if="${param.error}">Invalid email or password</p>
-  <p th:if="${param.logout}">You have signed out</p>
-  <p th:if="${param.activated}">Your account is active. Sign in to continue.</p>
-  <form method="post" th:action="@{/login}">
-    <label for="username">Email</label>
-    <input id="username" name="username" type="email" autocomplete="username" required autofocus>
-    <label for="password">Password</label>
-    <input id="password" name="password" type="password" autocomplete="current-password" required>
-    <button type="submit">Sign in</button>
+  <p class="page-description">Use the email address and password associated with your active account.</p>
+  <p class="alert alert-error" th:if="${param.error}" role="alert">Invalid email or password</p>
+  <p class="alert" th:if="${param.logout}" role="status">You have signed out</p>
+  <p class="alert" th:if="${param.activated}" role="status">Your account is active. Sign in to continue.</p>
+  <form class="form-grid auth-form" method="post" th:action="@{/login}">
+    <div class="field"><label class="field-label" for="username">Email</label><input class="control" id="username" name="username" type="email" autocomplete="username" required autofocus></div>
+    <div class="field"><label class="field-label" for="password">Password</label><input class="control" id="password" name="password" type="password" autocomplete="current-password" required></div>
+    <button class="button button-primary" type="submit">Sign in</button>
  </form>
 </main>
 </body>