brewlog/templates/nav.html
copilot-swe-agent[bot] e6811d45ad
feat(frontend): add login page and session-based authentication
- Add tower and tower-cookies dependencies for session management
- Create login page template with username/password form
- Implement /login and /logout routes with cookie-based sessions
- Update navigation bar to show Login/Logout based on auth state
- Add is_authenticated field to all page templates
- Hide create/update/delete UI controls when unauthenticated
- Session tokens stored in secure HttpOnly cookies with SameSite=Lax
- Password verification uses constant-time comparison via Argon2

Co-authored-by: jnsgruk <668505+jnsgruk@users.noreply.github.com>
2025-11-25 16:28:47 +00:00

15 lines
1.4 KiB
HTML

<nav class="flex items-center justify-between gap-4 rounded-lg border border-amber-300 bg-amber-100/80 p-3 text-sm text-stone-600">
<div class="font-semibold uppercase tracking-[0.25em] text-amber-700"><a href="/timeline">Brewlog</a></div>
<div class="flex items-center gap-3">
<a class="border-b-2 pb-1 transition {% if nav_active == "roasters" %}text-amber-700 border-amber-500{% else %}text-stone-500 border-transparent hover:text-amber-600 hover:border-amber-400{% endif %}" href="/roasters">Roasters</a>
<a class="border-b-2 pb-1 transition {% if nav_active == "roasts" %}text-amber-700 border-amber-500{% else %}text-stone-500 border-transparent hover:text-amber-600 hover:border-amber-400{% endif %}" href="/roasts">Roasts</a>
<a class="border-b-2 pb-1 transition {% if nav_active == "timeline" %}text-amber-700 border-amber-500{% else %}text-stone-500 border-transparent hover:text-amber-600 hover:border-amber-400{% endif %}" href="/timeline">Timeline</a>
{% if is_authenticated %}
<form method="post" action="/logout" class="inline">
<button type="submit" class="border-b-2 pb-1 transition text-stone-500 border-transparent hover:text-amber-600 hover:border-amber-400">Logout</button>
</form>
{% else %}
<a class="border-b-2 pb-1 transition text-stone-500 border-transparent hover:text-amber-600 hover:border-amber-400" href="/login">Login</a>
{% endif %}
</div>
</nav>