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
39 lines
1.5 KiB
HTML
39 lines
1.5 KiB
HTML
{% extends "base.html" %} {% import "partials/icons.html" as icons %} {% block title %}Brewlog · Data{% endblock %}
|
|
{% block content %}
|
|
<header class="flex flex-wrap items-start justify-between gap-4">
|
|
<div class="flex flex-col gap-2">
|
|
<h1 class="text-3xl font-semibold">Data</h1>
|
|
<p class="max-w-2xl text-sm text-stone-600">Browse all your coffee data.</p>
|
|
</div>
|
|
{% if is_authenticated %}
|
|
<a
|
|
href="/add?type={{ active_type }}"
|
|
class="inline-flex items-center gap-2 rounded-md bg-amber-600 px-4 py-2.5 text-sm font-semibold text-amber-50 transition hover:bg-amber-500"
|
|
>
|
|
{% call icons::plus_circle("h-4 w-4") %}
|
|
Add
|
|
</a>
|
|
{% endif %}
|
|
</header>
|
|
|
|
<nav class="flex flex-wrap gap-1 rounded-lg border border-amber-300 bg-amber-100/80 p-1.5 shadow-sm"
|
|
data-signals:_active-tab="'{{ active_type }}'">
|
|
{% for tab in tabs %}
|
|
<a
|
|
href="/data?type={{ tab.key }}"
|
|
data-class:bg-amber-600="$_activeTab === '{{ tab.key }}'"
|
|
data-class:text-white="$_activeTab === '{{ tab.key }}'"
|
|
data-class:shadow-sm="$_activeTab === '{{ tab.key }}'"
|
|
data-class:text-stone-600="$_activeTab !== '{{ tab.key }}'"
|
|
class="rounded-md px-3 py-1.5 text-sm font-medium transition"
|
|
data-on:click__prevent="$_activeTab = '{{ tab.key }}'; history.pushState(null, '', '/data?type={{ tab.key }}'); @get('/data?type={{ tab.key }}', {responseOverrides: {selector: '#data-content', mode: 'inner'}})"
|
|
>{{ tab.label }}</a>
|
|
{% endfor %}
|
|
</nav>
|
|
|
|
<div id="data-content">
|
|
{{ content|safe }}
|
|
</div>
|
|
|
|
<div id="detail-panel"></div>
|
|
{% endblock %}
|