Refactor stats and answers display for improved layout and readability

This commit is contained in:
Ross
2025-12-29 11:41:16 +00:00
parent f14ede86d3
commit efeed2a8b1
+30 -14
View File
@@ -39,17 +39,17 @@
</div>
<div id="stats-plot">{{plot|safe}}</div>
<div id="stats-block" title="low scores (<20% max) are excluded from statistics">
<h3>Stats</h3>
Candidates: {{cids|length}}<br />
Questions: <span id="question-number">{{question_number}}</span><br />
<span title="Max score">Available marks: {{max_score}}</span><br />
Mean: {{mean}}, Median {{median}}, Mode {{mode}}<br />
Top score: {{exam.stats_max}}
<div id="stats-block" title="low scores (<20% max) are excluded from statistics" class="mb-2 small">
<h5 class="mb-1">Stats</h5>
<div>Candidates: <span class="fw-semibold">{{cids|length}}</span></div>
<div>Questions: <span id="question-number">{{question_number}}</span></div>
<div title="Max score">Available marks: {{max_score}}</div>
<div>Mean: {{mean}}, Median {{median}}, Mode {{mode}}</div>
<div>Top score: {{exam.stats_max}}</div>
</div>
<div>
<table class="table table-dark table-striped table-hover table-sm cid-score-table sortable">
<div class="mb-3">
<div class="table-responsive">
<table class="table table-dark table-striped table-hover table-sm cid-score-table sortable small">
<tr>
<th title="click to sort by candidate / user id">Candidate ID</th>
<th title="click to sort by score">Score</th>
@@ -79,10 +79,18 @@
</tr>
{% endfor %}
</table>
</div>
</div>
<div>
<h3>Answers as a table</h3>
<table class="table table-dark table-striped table-hover table-sm col-sm">
<div class="mb-3">
<div class="d-flex justify-content-between align-items-center mb-1">
<h5 class="mb-0">Answers as a table</h5>
<div>
<button class="btn btn-sm btn-outline-secondary" data-bs-toggle="collapse" data-bs-target="#answers-table" aria-expanded="true">Toggle answers</button>
</div>
</div>
<div class="collapse show" id="answers-table">
<div class="table-responsive">
<table class="table table-dark table-striped table-hover table-sm col-sm small">
<thead class="thead-dark">
<tr>
<th>Candidate</th>
@@ -127,7 +135,9 @@
<td>{{user_scores|get_item:cid}}</td>
{% endfor %}
</tr>
</table>
</table>
</div>
</div>
{% block breakdown %}{% endblock breakdown %}
@@ -192,6 +202,12 @@
display: inline-block;
color: darkblue;
}
/* Reduce vertical spacing for dense score tables */
.cid-score-table td, .cid-score-table th, table.table-sm td, table.table-sm th {
padding: .25rem .4rem;
line-height: 1;
}
#stats-block { font-size: .9rem; }
</style>
{% endblock %}