3bbcd33933
Replace duplicated inline SVGs across 16 templates with reusable Askama macros from a new icons.html partial, reducing repetition and making icon updates a single-point change.
61 lines
2.6 KiB
HTML
61 lines
2.6 KiB
HTML
{% extends "base.html" %} {% import "partials/icons.html" as icons %} {% block title %}Brewlog · Cafe · {{ cafe.name }}{% endblock %} {%
|
|
block content %}
|
|
<header class="flex flex-col gap-2">
|
|
<h1 class="text-3xl font-semibold">{{ cafe.name }}</h1>
|
|
<p class="max-w-2xl text-sm text-stone-600">Detailed view for {{ cafe.name }}.</p>
|
|
</header>
|
|
<section class="grid gap-4 rounded-lg border border-amber-300 bg-amber-100/80 p-5 shadow-sm">
|
|
<dl class="grid gap-2 text-sm text-stone-700">
|
|
<div class="flex justify-between gap-2">
|
|
<dt class="font-medium text-stone-500">City</dt>
|
|
<dd class="text-right">{{ cafe.city }}</dd>
|
|
</div>
|
|
<div class="flex justify-between gap-2">
|
|
<dt class="font-medium text-stone-500">Country</dt>
|
|
<dd class="text-right">{{ cafe.country }}</dd>
|
|
</div>
|
|
<div class="flex justify-between gap-2">
|
|
<dt class="font-medium text-stone-500">Coordinates</dt>
|
|
<dd class="text-right">{{ cafe.latitude }}, {{ cafe.longitude }}</dd>
|
|
</div>
|
|
<div class="flex items-center justify-between gap-2">
|
|
<dt class="font-medium text-stone-500">Map</dt>
|
|
<dd class="flex justify-end">
|
|
<a
|
|
class="inline-flex items-center gap-2 rounded-md border border-amber-400 bg-amber-200/60 px-3 py-1 text-xs font-semibold text-amber-800 transition hover:border-amber-500 hover:bg-amber-200 hover:text-amber-900"
|
|
href="{{ cafe.map_url }}"
|
|
target="_blank"
|
|
rel="noreferrer noopener"
|
|
aria-label="Open {{ cafe.name }} in Google Maps"
|
|
>
|
|
{% call icons::location("h-4 w-4") %}
|
|
<span>Open in Maps</span>
|
|
</a>
|
|
</dd>
|
|
</div>
|
|
<div class="flex items-center justify-between gap-2">
|
|
<dt class="font-medium text-stone-500">Website</dt>
|
|
<dd class="flex justify-end">
|
|
{% if cafe.has_website %}
|
|
<a
|
|
class="inline-flex items-center gap-2 rounded-md border border-amber-400 bg-amber-200/60 px-3 py-1 text-xs font-semibold text-amber-800 transition hover:border-amber-500 hover:bg-amber-200 hover:text-amber-900"
|
|
href="{{ cafe.website_url }}"
|
|
target="_blank"
|
|
rel="noreferrer noopener"
|
|
aria-label="Visit {{ cafe.name }} website"
|
|
>
|
|
{% call icons::external_link("h-4 w-4") %}
|
|
<span>Visit</span>
|
|
</a>
|
|
{% else %}
|
|
<span>—</span>
|
|
{% endif %}
|
|
</dd>
|
|
</div>
|
|
<div class="flex justify-between gap-2">
|
|
<dt class="font-medium text-stone-500">Created</dt>
|
|
<dd class="text-right">{{ cafe.created_at }}</dd>
|
|
</div>
|
|
</dl>
|
|
</section>
|
|
{% endblock %}
|