ross/penracourses
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Refactor filter section layout in question table view for improved responsiveness and styling

Browse Source
This commit is contained in:
Ross
2025-10-20 17:16:32 +01:00
parent 815d853599
commit f6f208b065
1 changed files with 26 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files
templates/question_table_view.html
+26 -11
View File
@@ -55,11 +55,11 @@
max-height: 50vh;
overflow-y: auto;
}
.floating-filter .filter-toggle {
position: fixed;
right: 1rem;
bottom: 1rem;
z-index: 1040;
.floating-filter .filter-toggle {
position: fixed;
right: 1rem;
bottom: 1rem;
z-index: 1040;
}
/* minibar/tab styling - small visible handle so panel isn't fully hidden */
.bottom-filter-minibar {
@@ -73,14 +73,14 @@
</style>
<!-- Minibar: small visible strip when panel is collapsed -->
<div id="bottom-filter-minibar" class="bottom-filter-minibar">
<button class="btn btn-sm btn-outline-primary" type="button" data-bs-toggle="collapse" data-bs-target="#bottom-filter-body" aria-controls="bottom-filter-body">Filters</button>
</div>
<div id="bottom-filter-minibar" class="bottom-filter-minibar">
<button class="btn btn-sm btn-outline-primary" type="button" data-bs-toggle="collapse" data-bs-target="#bottom-filter-body" aria-controls="bottom-filter-body">Filters</button>
</div>
<button class="btn btn-primary filter-toggle d-md-none" type="button" data-bs-toggle="collapse" data-bs-target="#bottom-filter-body" aria-expanded="false" aria-controls="bottom-filter-body">Filters</button>
<div class="floating-filter shadow-lg">
<div id="bottom-filter-body" class="collapse show">
<div id="bottom-filter-body" class="collapse">
<div class="container-fluid">
<div class="d-flex justify-content-between align-items-start">
<div class="fw-bold">Filters</div>
@@ -92,8 +92,23 @@
<!-- filter body collapsible so minibar stays visible -->
<div class="filter-body mt-2">
<form action="" method="get">
{{ filter.form|crispy }}
<div class="mt-2">
<div class="row g-2">
{% for field in filter.form.visible_fields %}
<div class="col-12 col-sm-6 col-md-4 col-lg-3">
<div class="form-group">
{{ field.label_tag }}
{{ field }}
{% if field.errors %}
<div class="invalid-feedback d-block">{{ field.errors|striptags }}</div>
{% endif %}
{% if field.help_text %}
<small class="form-text text-muted">{{ field.help_text }}</small>
{% endif %}
</div>
</div>
{% endfor %}
</div>
<div class="mt-2 d-flex gap-2">
<button class="btn btn-primary btn-sm" type="submit">Apply</button>
<a class="btn btn-secondary btn-sm" href="?">Reset</a>
</div>