starred/WYGIWYH
1
0
Fork 0
mirror of https://github.com/eitchtee/WYGIWYH.git synced 2026-07-14 00:32:46 +02:00
Code Issues 14 Packages Projects Releases 10 Wiki Activity

feat: replace filter dropdown with collapsible

Browse Source
This commit is contained in:
Herculino Trotta
2024-11-30 15:51:08 -03:00
parent 1e60546eed
commit 05db41d34b
1 changed files with 27 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/templates/monthly_overview/pages/overview.html
+27 -24
View File
@@ -101,33 +101,36 @@
</div> </div>
</div> </div>
<div class="col-12 col-xl-8 order-2 order-xl-1"> <div class="col-12 col-xl-8 order-2 order-xl-1">
{# Filter transactions#}
<div class="row mb-1"> <div class="row mb-1">
<div class="col-sm-6 col-12"> <div class="col-sm-6 col-12">
<div class="dropdown"> {# Filter transactions button #}
<button type="button" class="btn btn-sm btn-outline-primary dropdown-toggle" data-bs-toggle="dropdown" <button type="button" class="btn btn-sm btn-outline-primary dropdown-toggle" type="button" data-bs-toggle="collapse" data-bs-target="#collapseExample" aria-expanded="false" aria-controls="collapseExample">
aria-expanded="false" data-bs-auto-close="false"> <i class="fa-solid fa-filter fa-fw me-2"></i>{% translate 'Filter transactions' %}
<i class="fa-solid fa-filter fa-fw me-2"></i>{% translate 'Filter transactions' %} </button>
</button> </div>
<form _="on change or submit or search trigger updated on window end {# Ordering button#}
install init_tom_select" <div class="col-sm-6 col-12 tw-content-center my-3 my-sm-0">
id="filter" <div class="text-sm-end" _="on change trigger updated on window">
class="dropdown-menu p-4 tw-min-w-full sm:tw-min-w-[30em] md:tw-min-w-[40em]"> <label for="order">{% translate "Order by" %}</label>
{% crispy filter.form %} <select class="tw-border-0 focus-visible:tw-outline-0 w-full pe-2 tw-leading-normal text-bg-tertiary tw-font-medium rounded" name="order" id="order">
</form> <option value="default">{% translate 'Default' %}</option>
</div> <option value="older">{% translate 'Oldest first' %}</option>
</div> <option value="newer">{% translate 'Newest first' %}</option>
<div class="col-sm-6 col-12 tw-content-center my-3 my-sm-0"> </select>
<div class="text-sm-end" _="on change trigger updated on window">
<label for="order">{% translate "Order by" %}</label>
<select class="tw-border-0 focus-visible:tw-outline-0 w-full pe-2 tw-leading-normal text-bg-tertiary tw-font-medium rounded" name="order" id="order">
<option value="default">{% translate 'Default' %}</option>
<option value="older">{% translate 'Oldest first' %}</option>
<option value="newer">{% translate 'Newest first' %}</option>
</select>
</div>
</div> </div>
</div> </div>
</div>
{# Filter transactions form#}
<div class="collapse" id="collapseExample">
<div class="card card-body">
<form _="on change or submit or search trigger updated on window end
install init_tom_select"
id="filter">
{% crispy filter.form %}
</form>
</div>
</div>
{# Transactions list#}
<div id="transactions" <div id="transactions"
class="show-loading" class="show-loading"
hx-get="{% url 'monthly_transactions_list' month=month year=year %}" hx-get="{% url 'monthly_transactions_list' month=month year=year %}"