Make grid filters controlled through data- fields

This commit is contained in:
2025-01-30 23:24:22 +01:00
parent 8e3816e2e2
commit ca3d4d09d5
2 changed files with 58 additions and 40 deletions

View File

@@ -35,12 +35,14 @@
</div>
</div>
</div>
<div class="row row-cols-lg-auto g-1 justify-content-center align-items-center pb-2">
<div id="grid-filter" class="row row-cols-lg-auto g-1 justify-content-center align-items-center pb-2">
<div class="col-12 flex-grow-1">
<label class="visually-hidden" for="grid-status">Status</label>
<div class="input-group">
<span class="input-group-text"><i class="ri-checkbox-line"></i><span class="ms-1 d-none d-xl-inline"> Status</span></span>
<select id="grid-status" class="form-select form-select-sm" autocomplete="off">
<select id="grid-status" class="form-select form-select-sm"
data-filter="status"
autocomplete="off">
<option value="" selected>All</option>
<option value="-has-missing">Set is complete</option>
<option value="has-missing">Set has missing pieces</option>
@@ -56,7 +58,9 @@
<label class="visually-hidden" for="grid-theme">Theme</label>
<div class="input-group">
<span class="input-group-text"><i class="ri-price-tag-3-line"></i><span class="ms-1 d-none d-xl-inline"> Theme</span></span>
<select id="grid-theme" class="form-select form-select-sm" autocomplete="off">
<select id="grid-theme" class="form-select form-select-sm"
data-filter="solo" data-filter-attribute="theme"
autocomplete="off">
<option value="" selected>All</option>
{% for theme in collection.themes %}
<option value="{{ theme | lower }}">{{ theme }}</option>