Phase 1.2: session login + empty HTMX dashboard
- Session login for the single user Sam: server-side session store with an HMAC-signed session cookie, POST /login, POST /logout, and double-submit CSRF on every form post. Unauthenticated requests to / and /partials/* redirect to /login?next=... - Empty dashboard shell in the Family Home Lab design system: left nav (category and folder placeholders), centre list, right detail pane. - Copy tokens.css and the self-hosted Inter fonts from the family-home-lab design system into web/static; vendor htmx 2.0.4. No cross-project imports at runtime. - Dark mode via prefers-color-scheme plus a persisted toggle; phone-first layout with 44px touch targets, hairline borders, 8px grid, pill CTAs. - Config: EMAIL_AGENT_PASSWORD for the login password, falling back to EMAIL_AGENT_SESSION_SECRET so one configured secret is enough. Co-Authored-By: Paperclip <noreply@paperclip.ing>
This commit is contained in:
45
web/templates/login.html
Normal file
45
web/templates/login.html
Normal file
@@ -0,0 +1,45 @@
|
||||
<!doctype html>
|
||||
<html lang="en" data-theme="light">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>Sign in · Email Agent</title>
|
||||
<link rel="stylesheet" href="/static/tokens.css">
|
||||
<link rel="stylesheet" href="/static/app.css">
|
||||
<script>
|
||||
(function () {
|
||||
try {
|
||||
var t = localStorage.getItem("ea-theme");
|
||||
if (!t) t = matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
|
||||
document.documentElement.setAttribute("data-theme", t);
|
||||
} catch (e) {}
|
||||
})();
|
||||
</script>
|
||||
</head>
|
||||
<body class="login-body">
|
||||
<main class="login-wrap">
|
||||
<h1 class="login-greeting">{{.PartOfDay}}, Sam</h1>
|
||||
<form class="auth-card" method="post" action="/login" autocomplete="on">
|
||||
<div>
|
||||
<p class="auth-brand">Email Agent</p>
|
||||
<h2>Sign in</h2>
|
||||
<p class="muted">The family inbox triage desk.</p>
|
||||
</div>
|
||||
|
||||
{{if .Error}}<div class="alert alert-error" role="alert">{{.Error}}</div>{{end}}
|
||||
{{if not .Configured}}<div class="alert" role="status">Login is not configured. Set <code>EMAIL_AGENT_PASSWORD</code> (or <code>EMAIL_AGENT_SESSION_SECRET</code>) on the host.</div>{{end}}
|
||||
|
||||
<input type="hidden" name="csrf" value="{{.CSRFToken}}">
|
||||
<input type="hidden" name="next" value="{{.Next}}">
|
||||
|
||||
<div class="field">
|
||||
<label for="password">Password</label>
|
||||
<input class="text-input" type="password" id="password" name="password"
|
||||
autocomplete="current-password" required {{if .Configured}}autofocus{{end}}>
|
||||
</div>
|
||||
|
||||
<button class="btn btn-primary btn-block" type="submit">Sign in</button>
|
||||
</form>
|
||||
</main>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user