4bdfc661f9
Replace per-entity pages (/roasters, /roasts, /bags, /brews, /gear, /cafes, /cups) and detail pages with a single tabbed /data view and a dedicated /add page for entity creation. - Add /data route with tab-based navigation using Datastar - Add /add route consolidating all create forms - Remove per-entity page handlers and standalone templates - Remove detail page routes, handlers, and templates - Update ListNavigator to accept String paths for query-param URLs - Update home page and timeline links to use new /data?type=X paths - Update nav to reference /data instead of individual entity pages
54 lines
4 KiB
HTML
54 lines
4 KiB
HTML
{% import "partials/icons.html" as icons %}
|
|
<nav class="relative rounded-lg border border-amber-300 bg-amber-100/80 p-3 text-sm text-stone-600" data-signals:_nav-open="false">
|
|
<div class="flex items-center justify-between">
|
|
<div class="font-semibold uppercase tracking-[0.25em] text-amber-700"><a href="/">B{rew}log</a></div>
|
|
<!-- Desktop links -->
|
|
<div class="hidden md:flex items-center gap-3">
|
|
<a class="border-b-2 pb-1 transition {% if nav_active == "home" %}text-amber-700 border-amber-500{% else %}text-stone-500 border-transparent hover:text-amber-600 hover:border-amber-400{% endif %}" href="/">Home</a>
|
|
<a class="border-b-2 pb-1 transition {% if nav_active == "data" %}text-amber-700 border-amber-500{% else %}text-stone-500 border-transparent hover:text-amber-600 hover:border-amber-400{% endif %}" href="/data">Data</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 %}
|
|
<a class="border-b-2 pb-1 transition {% if nav_active == "checkin" %}text-amber-700 border-amber-500{% else %}text-stone-500 border-transparent hover:text-amber-600 hover:border-amber-400{% endif %}" href="/check-in" aria-label="Check In">
|
|
{% call icons::checkin("inline h-4 w-4") %}
|
|
</a>
|
|
<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" aria-label="Logout">
|
|
{% call icons::logout("inline h-4 w-4") %}
|
|
</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" aria-label="Login">
|
|
{% call icons::login("inline h-4 w-4") %}
|
|
</a>
|
|
{% endif %}
|
|
</div>
|
|
<!-- Hamburger button (mobile only) -->
|
|
<button class="md:hidden p-1 text-amber-700" data-on:click="$_navOpen = !$_navOpen" aria-label="Toggle menu">
|
|
<span data-show="!$_navOpen">{% call icons::hamburger("h-6 w-6") %}</span>
|
|
<span data-show="$_navOpen" style="display:none">{% call icons::close("h-6 w-6") %}</span>
|
|
</button>
|
|
</div>
|
|
<!-- Mobile menu -->
|
|
<div class="md:hidden flex flex-col gap-2 pt-3 mt-3 border-t border-amber-300" data-show="$_navOpen" style="display:none">
|
|
<a class="py-1 transition {% if nav_active == "home" %}text-amber-700 font-medium{% else %}text-stone-500 hover:text-amber-600{% endif %}" href="/">Home</a>
|
|
<a class="py-1 transition {% if nav_active == "data" %}text-amber-700 font-medium{% else %}text-stone-500 hover:text-amber-600{% endif %}" href="/data">Data</a>
|
|
<a class="py-1 transition {% if nav_active == "timeline" %}text-amber-700 font-medium{% else %}text-stone-500 hover:text-amber-600{% endif %}" href="/timeline">Timeline</a>
|
|
{% if is_authenticated %}
|
|
<a class="py-1 transition inline-flex items-center gap-1 {% if nav_active == "checkin" %}text-amber-700 font-medium{% else %}text-stone-500 hover:text-amber-600{% endif %}" href="/check-in">
|
|
{% call icons::checkin("inline h-4 w-4") %}
|
|
Check In
|
|
</a>
|
|
<form method="post" action="/logout" class="inline">
|
|
<button type="submit" class="py-1 transition inline-flex items-center gap-1 text-stone-500 hover:text-amber-600 text-left">
|
|
{% call icons::logout("inline h-4 w-4") %}
|
|
Logout
|
|
</button>
|
|
</form>
|
|
{% else %}
|
|
<a class="py-1 transition inline-flex items-center gap-1 text-stone-500 hover:text-amber-600" href="/login">
|
|
{% call icons::login("inline h-4 w-4") %}
|
|
Login
|
|
</a>
|
|
{% endif %}
|
|
</div>
|
|
</nav>
|