filipriec/kompress_eshop
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

search needs button now

Browse Source
This commit is contained in:
Priec
2026-06-25 16:36:50 +02:00
parent 848042c304
commit 194e9e2de3
1 changed files with 22 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
assets/views/shop/_search.html
View File

@@ -16,7 +16,9 @@
<form action="/search" method="get" role="search" <form action="/search" method="get" role="search"
hx-get="/search" hx-target="#shop-results" hx-swap="innerHTML" hx-get="/search" hx-target="#shop-results" hx-swap="innerHTML"
hx-push-url="true" hx-indicator="#search-spinner" hx-push-url="true" hx-indicator="#search-spinner"
hx-trigger="submit, change, keyup changed delay:350ms from:input[name='q']" {# The text query runs only on submit (Enter / the Search button); the
sort / per-page / in-stock controls still apply immediately on change. #}
hx-trigger="submit, change from:select, change from:input[type='checkbox']"
class="space-y-3"> class="space-y-3">
{# Category comes from the sidebar; keep it on the query so searching / {# Category comes from the sidebar; keep it on the query so searching /
@@ -24,7 +26,8 @@
<input type="hidden" name="category" value="{{ selected_category | default(value='all') }}" /> <input type="hidden" name="category" value="{{ selected_category | default(value='all') }}" />
<!-- search box --> <!-- search box -->
<div class="relative max-w-xl"> <div class="flex max-w-xl gap-2">
<div class="relative flex-1">
<span class="pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3 text-on-surface/50 dark:text-on-surface-dark/50"> <span class="pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3 text-on-surface/50 dark:text-on-surface-dark/50">
{{ ui::icon(name="search", size="size-5") }} {{ ui::icon(name="search", size="size-5") }}
</span> </span>
@@ -39,6 +42,10 @@
</svg> </svg>
</span> </span>
</div> </div>
<button type="submit" class="shrink-0 rounded-radius bg-primary px-5 text-sm font-bold text-on-primary transition hover:opacity-90 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary dark:bg-primary-dark dark:text-on-primary-dark dark:focus-visible:outline-primary-dark">
{{ t(key="search-button", lang=L) }}
</button>
</div>
<!-- sort + product card style switch --> <!-- sort + product card style switch -->
<div class="flex flex-wrap items-center justify-end gap-3"> <div class="flex flex-wrap items-center justify-end gap-3">