brewlog/templates/partials/scan_input.html
Jon Seager 6829239bfc
style(ui): shrink open bag cards and add manual-add button to quick bar
- Reduce open bag card height from 280px to 222px
- Add a + button next to the places icon in the scan input bar
  that links to /add for manual entry
2026-02-07 20:07:23 +00:00

38 lines
1.5 KiB
HTML

{% import "partials/icons.html" as icons %}
{% macro scan_input(form_id, image_input_id, extracting_signal, error_signal, placeholder, spinner_text) %}
<input type="hidden" name="image" id="{{ image_input_id }}" />
<div data-show="!{{ extracting_signal }}" class="flex items-center gap-2">
<brew-photo-capture target-input="{{ image_input_id }}" target-form="{{ form_id }}"
class="shrink-0 inline-flex items-center justify-center rounded-md border p-2.5 text-accent transition hover:bg-surface-alt cursor-pointer"
aria-label="Take Photo"
>
{{ icons::camera("h-5 w-5") }}
</brew-photo-capture>
<a href="/check-in"
class="shrink-0 inline-flex items-center justify-center rounded-md border p-2.5 text-accent transition hover:bg-surface-alt"
title="Check in at a cafe"
aria-label="Check in at a cafe"
>
{{ icons::location("h-5 w-5") }}
</a>
<a href="/add"
class="shrink-0 inline-flex items-center justify-center rounded-md border p-2.5 text-accent transition hover:bg-surface-alt"
title="Add manually"
aria-label="Add manually"
>
{{ icons::plus("h-5 w-5") }}
</a>
<input
type="text"
name="prompt"
class="input-field w-full text-sm"
placeholder="{{ placeholder }}"
/>
</div>
<div data-show="{{ extracting_signal }}" style="display:none" class="flex items-center gap-3 text-sm text-accent">
{{ icons::spinner("h-5 w-5") }}
{{ spinner_text }}
</div>
<p data-show="{{ error_signal }}" data-text="{{ error_signal }}" style="display:none" class="mt-2 text-sm text-red-600"></p>
{% endmacro %}