Refactor stats and answers display for improved layout and readability
This commit is contained in:
@@ -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 %}
|
||||
Reference in New Issue
Block a user