Refactor resource search panel: simplify input trigger and improve layout for search results

This commit is contained in:
Ross
2025-12-15 10:47:42 +00:00
parent c01000f06e
commit 0644ed99f4
@@ -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 -->