fb67f0659c
Overhaul the web UI with CSS custom property-based theming and dark mode support. Extract reusable template partials (location search, scan input) and web components (photo-capture, searchable-select). Add version and commit info to page footer. - Replace hardcoded amber palette with semantic theme tokens - Add dark mode with localStorage persistence and system preference detection - Extract <brew-photo-capture> and <searchable-select> web components - Extract location_search and scan_input Askama macros - Add sun/moon, timeline, database, map icons - Display version and git commit in footer - Improve timeline coordinate rounding and map link formatting - Add roast_name, roaster_name, remaining to BagOptionView
23 lines
1.2 KiB
HTML
23 lines
1.2 KiB
HTML
<div id="nearby-results" class="mt-3 max-h-60 overflow-y-auto rounded-lg border bg-surface">
|
|
{% if cafes.is_empty() %}
|
|
<p class="px-3 py-2 text-sm text-stone-500">No nearby cafes found.</p>
|
|
{% else %}
|
|
<h3 class="px-3 py-2 text-xs font-semibold text-stone-500 uppercase tracking-wide">Nearby</h3>
|
|
{% for cafe in cafes %}
|
|
<button
|
|
type="button"
|
|
class="w-full px-3 py-2 text-left text-sm hover:bg-surface-alt transition"
|
|
data-cafe-name="{{ cafe.name }}"
|
|
data-cafe-city="{{ cafe.city }}"
|
|
data-cafe-country="{{ cafe.country }}"
|
|
data-cafe-lat="{{ cafe.latitude }}"
|
|
data-cafe-lng="{{ cafe.longitude }}"
|
|
data-cafe-website="{{ cafe.website }}"
|
|
data-on:click="$_cafeId = ''; $_cafeName = el.dataset.cafeName; $_cafeCity = el.dataset.cafeCity; $_cafeCountry = el.dataset.cafeCountry; $_cafeLat = parseFloat(el.dataset.cafeLat); $_cafeLng = parseFloat(el.dataset.cafeLng); $_cafeWebsite = el.dataset.cafeWebsite; $_reviewingCafe = true"
|
|
>
|
|
<span class="font-medium text-stone-800">{{ cafe.name }}</span>
|
|
<span class="ml-2 text-xs text-stone-500">{{ cafe.location }} · {{ cafe.distance }}</span>
|
|
</button>
|
|
{% endfor %}
|
|
{% endif %}
|
|
</div>
|