feat: add cancel buttons to all add forms

Match the edit form pattern by adding a Cancel button (history.back())
below each Save button in the sticky submit bar.
This commit is contained in:
Jon Seager 2026-02-11 10:24:28 +00:00
parent 720ebcbad3
commit 67f218495f
No known key found for this signature in database

View file

@ -190,13 +190,20 @@
</label>
</div>
{{ img::deferred_upload("roaster-image", "Add image (optional)") }}
<div class="sticky-submit flex items-center justify-end">
<div class="sticky-submit flex flex-col gap-2">
<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::plus("h-4 w-4") }} Save Roaster
</button>
<button
type="button"
onclick="history.back()"
class="inline-flex w-full items-center justify-center gap-2 rounded-md border px-4 py-2 text-sm font-medium text-text-secondary transition hover:bg-surface-alt"
>
{{ icons::x_mark("h-4 w-4") }} Cancel
</button>
</div>
</form>
</div>
@ -403,13 +410,20 @@
</label>
</div>
{{ img::deferred_upload("roast-image", "Add image (optional)") }}
<div class="sticky-submit flex items-center justify-end">
<div class="sticky-submit flex flex-col gap-2">
<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::plus("h-4 w-4") }} Save Roast
</button>
<button
type="button"
onclick="history.back()"
class="inline-flex w-full items-center justify-center gap-2 rounded-md border px-4 py-2 text-sm font-medium text-text-secondary transition hover:bg-surface-alt"
>
{{ icons::x_mark("h-4 w-4") }} Cancel
</button>
</div>
</form>
</div>
@ -498,13 +512,20 @@
/>
</label>
</div>
<div class="sticky-submit flex items-center justify-end">
<div class="sticky-submit flex flex-col gap-2">
<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::plus("h-4 w-4") }} Save Bag
</button>
<button
type="button"
onclick="history.back()"
class="inline-flex w-full items-center justify-center gap-2 rounded-md border px-4 py-2 text-sm font-medium text-text-secondary transition hover:bg-surface-alt"
>
{{ icons::x_mark("h-4 w-4") }} Cancel
</button>
</div>
</form>
{% endif %}
@ -947,13 +968,20 @@
/>
</div>
{{ img::deferred_upload("brew-image", "Add image (optional)") }}
<div class="sticky-submit flex items-center justify-end">
<div class="sticky-submit flex flex-col gap-2">
<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") }} Save Brew
</button>
<button
type="button"
onclick="history.back()"
class="inline-flex w-full items-center justify-center gap-2 rounded-md border px-4 py-2 text-sm font-medium text-text-secondary transition hover:bg-surface-alt"
>
{{ icons::x_mark("h-4 w-4") }} Cancel
</button>
</div>
</form>
{% endif %}
@ -1023,13 +1051,20 @@
</label>
</div>
{{ img::deferred_upload("gear-image", "Add image (optional)") }}
<div class="sticky-submit flex items-center justify-end">
<div class="sticky-submit flex flex-col gap-2">
<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::plus("h-4 w-4") }} Save Gear
</button>
<button
type="button"
onclick="history.back()"
class="inline-flex w-full items-center justify-center gap-2 rounded-md border px-4 py-2 text-sm font-medium text-text-secondary transition hover:bg-surface-alt"
>
{{ icons::x_mark("h-4 w-4") }} Cancel
</button>
</div>
</form>
</div>
@ -1188,13 +1223,20 @@
</label>
</div>
{{ img::deferred_upload("cafe-image", "Add image (optional)") }}
<div class="sticky-submit flex items-center justify-end">
<div class="sticky-submit flex flex-col gap-2">
<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::plus("h-4 w-4") }} Save Cafe
</button>
<button
type="button"
onclick="history.back()"
class="inline-flex w-full items-center justify-center gap-2 rounded-md border px-4 py-2 text-sm font-medium text-text-secondary transition hover:bg-surface-alt"
>
{{ icons::x_mark("h-4 w-4") }} Cancel
</button>
</div>
</form>
</div>
@ -1297,13 +1339,20 @@
</searchable-select>
</div>
</div>
<div class="sticky-submit flex items-center justify-end">
<div class="sticky-submit flex flex-col gap-2">
<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::plus("h-4 w-4") }} Save Cup
</button>
<button
type="button"
onclick="history.back()"
class="inline-flex w-full items-center justify-center gap-2 rounded-md border px-4 py-2 text-sm font-medium text-text-secondary transition hover:bg-surface-alt"
>
{{ icons::x_mark("h-4 w-4") }} Cancel
</button>
</div>
</form>
{% endif %}