refactor(ui): simplify detail page subtitles to breadcrumb links

Replace verbose subtitles with a consistent pattern across all 7 detail
pages: a linked entity type pointing to the data list page, followed by
the creation date.

templates/pages/bag.html

@@ -19,8 +19,12 @@
     <div class="flex flex-col gap-2">
       <h1 class="text-3xl font-semibold">{{ bag.roast_name }}</h1>
       <p class="text-sm text-text-secondary">
-        {{ bag.roaster_name }} · {{ bag.amount }} · Opened
+        <a
-        {{ bag.created_date }}
+          href="/data?type=bags"
+          class="text-accent hover:text-accent-hover transition"
+          >Bags</a
+        >
+        · {{ bag.created_date }}
       </p>
     </div>
   </header>

templates/pages/brew.html

@@ -21,8 +21,12 @@
     <div class="flex flex-col gap-2">
       <h1 class="text-3xl font-semibold">{{ brew.roast_name }}</h1>
       <p class="text-sm text-text-secondary">
-        {{ brew.roaster_name }} · Brewed {{ brew.created_date }} at
+        <a
-        {{ brew.created_time }}
+          href="/data?type=brews"
+          class="text-accent hover:text-accent-hover transition"
+          >Brews</a
+        >
+        · {{ brew.created_date }}
       </p>
     </div>
   </header>

templates/pages/cafe.html

@@ -15,8 +15,12 @@
     <div class="flex flex-col gap-2">
       <h1 class="text-3xl font-semibold">{{ cafe.name }}</h1>
       <p class="text-sm text-text-secondary">
-        {{ cafe.city }}, {{ cafe.country_flag }} {{ cafe.country }} · Added
+        <a
-        {{ cafe.created_date }}
+          href="/data?type=cafes"
+          class="text-accent hover:text-accent-hover transition"
+          >Cafes</a
+        >
+        · {{ cafe.created_date }}
       </p>
     </div>
   </header>

templates/pages/cup.html

@@ -19,8 +19,12 @@
     <div class="flex flex-col gap-2">
       <h1 class="text-3xl font-semibold">{{ cup.roast_name }}</h1>
       <p class="text-sm text-text-secondary">
-        {{ cup.roaster_name }} · {{ cup.cafe_name }}, {{ cup.cafe_city }} ·
+        <a
-        {{ cup.created_date }}
+          href="/data?type=cups"
+          class="text-accent hover:text-accent-hover transition"
+          >Cups</a
+        >
+        · {{ cup.created_date }}
       </p>
     </div>
   </header>

templates/pages/gear.html

@@ -15,7 +15,12 @@
     <div class="flex flex-col gap-2">
       <h1 class="text-3xl font-semibold">{{ gear.make }} {{ gear.model }}</h1>
       <p class="text-sm text-text-secondary">
-        {{ gear.category_label }} · Added {{ gear.created_date }}
+        <a
+          href="/data?type=gear"
+          class="text-accent hover:text-accent-hover transition"
+          >Gear</a
+        >
+        · {{ gear.created_date }}
       </p>
     </div>
   </header>

templates/pages/roast.html

@@ -15,8 +15,12 @@
     <div class="flex flex-col gap-2">
       <h1 class="text-3xl font-semibold">{{ roast.name }}</h1>
       <p class="text-sm text-text-secondary">
-        {{ roast.roaster_name }} · {{ roast.origin_flag }} {{ roast.origin }} ·
+        <a
-        Added {{ roast.created_date }}
+          href="/data?type=roasts"
+          class="text-accent hover:text-accent-hover transition"
+          >Roasts</a
+        >
+        · {{ roast.created_date }}
       </p>
     </div>
   </header>

templates/pages/roaster.html

@@ -16,9 +16,12 @@
     <div class="flex flex-col gap-2">
       <h1 class="text-3xl font-semibold">{{ roaster.name }}</h1>
       <p class="text-sm text-text-secondary">
-        {{ roaster.country_flag }}
+        <a
-        {{ roaster.country }}{% if let Some(c) = roaster.city %}· {{ c }}{% endif %}
+          href="/data?type=roasters"
-        · Added {{ roaster.created_date }}
+          class="text-accent hover:text-accent-hover transition"
+          >Roasters</a
+        >
+        · {{ roaster.created_date }}
       </p>
     </div>
   </header>