moby/brewlog
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

style(ui): add icons to all primary buttons, align to Outlined style

Browse source 
- Add chevron_right icon macro
- Add icon to checkin "Next" and register "Go to Brewlog" buttons
- Align Back (checkin) and Cancel (scan_result_form) to Outlined
  style: inline-flex, font-medium
- Rename "Log Brew" → "Save Brew" for consistency with other forms
This commit is contained in:
Jon Seager 2026-02-08 09:35:11 +00:00
parent 4da9c65f56
commit 123d035417
No known key found for this signature in database
5 changed files with 13 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
templates/pages/add.html
View file

@ -438,7 +438,7 @@
</div>
<div class="sticky-submit flex items-center justify-end">
<button type="submit" class="inline-flex w-full items-center justify-center gap-2 rounded-md bg-accent px-4 py-2 text-sm font-semibold text-accent-text transition hover:bg-accent-hover">
{{ icons::beaker("h-4 w-4") }} Log Brew
{{ icons::beaker("h-4 w-4") }} Save Brew
</button>
</div>
</form>

6
templates/pages/checkin.html
View file

@ -185,17 +185,17 @@ block title %}Brewlog · Check In{% endblock %} {% block head %}
<div class="mt-4 flex items-center justify-end gap-2">
<button
type="button"
class="rounded-md border px-4 py-2 text-sm font-semibold text-text transition hover:bg-surface-alt"
class="inline-flex items-center gap-2 rounded-md border px-4 py-2 text-sm font-medium text-text transition hover:bg-surface-alt"
data-on:click="$_reviewingCafe = false; $_cafeName = ''; $_cafeCity = ''; $_cafeCountry = ''; $_cafeLat = 0; $_cafeLng = 0; $_cafeWebsite = ''"
>
Back
</button>
<button
type="button"
class="rounded-md bg-accent px-4 py-2 text-sm font-semibold text-accent-text transition hover:bg-accent-hover"
class="inline-flex items-center justify-center gap-2 rounded-md bg-accent px-4 py-2 text-sm font-semibold text-accent-text transition hover:bg-accent-hover"
data-on:click="$_reviewingCafe = false; $_step = 2"
>
Next
Next {{ icons::chevron_right("h-4 w-4") }}
</button>
</div>
</div>

3
templates/pages/register.html
View file

@ -60,7 +60,8 @@
</div>
<a
href="/"
class="mt-4 block w-full rounded-md bg-accent px-4 py-3 text-center text-sm font-semibold text-accent-text transition hover:bg-accent-hover" >
class="mt-4 inline-flex w-full items-center justify-center gap-2 rounded-md bg-accent px-4 py-3 text-sm font-semibold text-accent-text transition hover:bg-accent-hover" >
{{ icons::check_circle("h-4 w-4") }}
Go to Brewlog
</a>
</div>

2
templates/partials/forms/scan_result_form.html
View file

@ -114,7 +114,7 @@
<button
type="button"
data-on:click="$_scanExtracted = false; $_matchedRoasterId = ''; $_matchedRoastId = ''"
class="inline-flex items-center gap-2 rounded-md border px-4 py-2 text-sm font-semibold text-text transition hover:bg-surface-alt"
class="inline-flex items-center gap-2 rounded-md border px-4 py-2 text-sm font-medium text-text transition hover:bg-surface-alt"
>
{{ icons::x_mark("h-4 w-4") }} Cancel
</button>

6
templates/partials/icons.html
View file

@ -204,3 +204,9 @@
<path d="M6.28 5.22a.75.75 0 0 0-1.06 1.06L8.94 10l-3.72 3.72a.75.75 0 1 0 1.06 1.06L10 11.06l3.72 3.72a.75.75 0 1 0 1.06-1.06L11.06 10l3.72-3.72a.75.75 0 0 0-1.06-1.06L10 8.94 6.28 5.22Z" />
</svg>
{% endmacro %}
{% macro chevron_right(class) %}
<svg class="{{ class }}" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
<path fill-rule="evenodd" d="M8.22 5.22a.75.75 0 0 1 1.06 0l4.25 4.25a.75.75 0 0 1 0 1.06l-4.25 4.25a.75.75 0 0 1-1.06-1.06L11.94 10 8.22 6.28a.75.75 0 0 1 0-1.06Z" clip-rule="evenodd" />
</svg>
{% endmacro %}