March 17 2026: form editor - remove show/hide per-item break down in re-inspect result page
This commit is contained in:
@@ -251,7 +251,7 @@
|
||||
</div>
|
||||
|
||||
{# Summary counters #}
|
||||
<div class="d-flex gap-4 px-4 py-2 border-bottom bg-light" style="font-size:.82rem;">
|
||||
<div class="d-flex gap-4 px-4 py-2 bg-light" style="font-size:.82rem;">
|
||||
<span class="text-success fw-semibold">
|
||||
<i class="bi bi-arrow-up-short fs-5 align-middle"></i>
|
||||
{{ comparison.improved }} improved
|
||||
@@ -266,91 +266,7 @@
|
||||
</span>
|
||||
</div>
|
||||
|
||||
{# Per-item table — collapsible #}
|
||||
<div class="collapse" id="comparisonDetail">
|
||||
<div class="card-body p-0">
|
||||
<div class="table-responsive">
|
||||
<table class="table table-sm mb-0" style="font-size:.8rem;">
|
||||
<thead class="table-light">
|
||||
<tr>
|
||||
<th>Category</th>
|
||||
<th>Item</th>
|
||||
<th class="text-center" width="90">Previous</th>
|
||||
<th class="text-center" width="90">Current</th>
|
||||
<th class="text-center" width="90">Change</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for row in comparison.rows %}
|
||||
<tr class="{{ 'table-success' if row.delta and row.delta > 0
|
||||
else 'table-danger' if row.delta and row.delta < 0
|
||||
else '' }}">
|
||||
<td class="text-muted small">{{ row.category }}</td>
|
||||
<td>{{ row.description[:70] }}{% if row.description|length > 70 %}…{% endif %}</td>
|
||||
<td class="text-center">
|
||||
{% if row.parent_pct is not none %}
|
||||
<span class="badge bg-{{ 'success' if row.parent_pct >= 80 else 'warning text-dark' if row.parent_pct >= 50 else 'danger' }}">
|
||||
{{ row.parent_pct }}%
|
||||
</span>
|
||||
{% else %}<span class="text-muted">—</span>{% endif %}
|
||||
</td>
|
||||
<td class="text-center">
|
||||
{% if row.current_pct is not none %}
|
||||
<span class="badge bg-{{ 'success' if row.current_pct >= 80 else 'warning text-dark' if row.current_pct >= 50 else 'danger' }}">
|
||||
{{ row.current_pct }}%
|
||||
</span>
|
||||
{% else %}<span class="text-muted">—</span>{% endif %}
|
||||
</td>
|
||||
<td class="text-center fw-semibold">
|
||||
{% if row.delta is not none %}
|
||||
{% if row.delta > 0 %}
|
||||
<span class="text-success">+{{ row.delta }}%</span>
|
||||
{% elif row.delta < 0 %}
|
||||
<span class="text-danger">{{ row.delta }}%</span>
|
||||
{% else %}
|
||||
<span class="text-muted">—</span>
|
||||
{% endif %}
|
||||
{% else %}<span class="text-muted">N/A</span>{% endif %}
|
||||
</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-footer bg-white text-center py-2">
|
||||
<button class="btn btn-sm btn-outline-secondary"
|
||||
data-bs-toggle="collapse"
|
||||
data-bs-target="#comparisonDetail"
|
||||
aria-expanded="false">
|
||||
<i class="bi bi-chevron-down me-1"></i>
|
||||
<span class="show-label">Show per-item breakdown</span>
|
||||
<span class="hide-label d-none">Hide breakdown</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
// Toggle chevron and label text when collapse opens/closes
|
||||
(function () {
|
||||
var el = document.getElementById('comparisonDetail');
|
||||
if (!el) return;
|
||||
el.addEventListener('show.bs.collapse', function () {
|
||||
document.querySelector('.show-label').classList.add('d-none');
|
||||
document.querySelector('.hide-label').classList.remove('d-none');
|
||||
document.querySelector('[data-bs-target="#comparisonDetail"] .bi').className =
|
||||
'bi bi-chevron-up me-1';
|
||||
});
|
||||
el.addEventListener('hide.bs.collapse', function () {
|
||||
document.querySelector('.hide-label').classList.add('d-none');
|
||||
document.querySelector('.show-label').classList.remove('d-none');
|
||||
document.querySelector('[data-bs-target="#comparisonDetail"] .bi').className =
|
||||
'bi bi-chevron-down me-1';
|
||||
});
|
||||
}());
|
||||
</script>
|
||||
{% endif %}
|
||||
|
||||
{# Header #}
|
||||
|
||||
Reference in New Issue
Block a user