Refactor resource search panel: simplify input trigger and improve layout for search results
This commit is contained in:
@@ -4,15 +4,15 @@
|
||||
<div class="col-auto" style="flex: 1 1 300px;">
|
||||
<input type="search" id="resource-search-q" name="q" class="form-control form-control-sm" placeholder="Search resources by name, description or URL"
|
||||
hx-get="{% url 'atlas:resource_search_widget' %}"
|
||||
hx-trigger="input changed delay:500ms, keyup[key=='Enter']"
|
||||
hx-trigger="input delay:500ms"
|
||||
hx-target="#resource-search-results"
|
||||
hx-swap="innerHTML"
|
||||
hx-include="#resource-search-panel"
|
||||
hx-indicator=".htmx-indicator">
|
||||
hx-indicator=".htmx-indicator">
|
||||
</div>
|
||||
<div class="htmx-indicator col-auto">
|
||||
<img src="/img/bars.svg" alt=""/> Searching...
|
||||
</div>
|
||||
<img src="/img/bars.svg" alt=""/> Searching...
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<select name="site" class="form-select form-select-sm">
|
||||
<option value="">All sites</option>
|
||||
@@ -39,3 +39,5 @@
|
||||
|
||||
<div id="resource-search-results" class="mt-2"></div>
|
||||
</div>
|
||||
|
||||
<!-- pure HTMX: no JS fallback; hx-trigger on the input uses input+debounce -->
|
||||
|
||||
Reference in New Issue
Block a user