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

Refactor response badges in exam review to use border colors based on correctness percentage for improved visual feedback

Browse Source
This commit is contained in:
Ross
2025-11-10 13:12:20 +00:00
parent bd71c669f0
commit d176288607
2 changed files with 37 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files
physics/templates/physics/partials/exam_review_question_responses_fragment.html
+15 -15
View File
@@ -31,51 +31,51 @@
<div class="d-flex align-items-center"> <div class="d-flex align-items-center">
<span class="me-1 small text-muted">A</span> <span class="me-1 small text-muted">A</span>
{% if ua.a is None %} {% if ua.a is None %}
<span class="badge bg-light text-muted">N/A</span> <span class="badge border border-secondary text-muted bg-white">N/A</span>
{% elif ua.a == question.a_answer %} {% elif ua.a == question.a_answer %}
<span class="badge bg-success">{{ ua.a|yesno:"T,F" }}</span> <span class="badge border border-success text-success bg-white">{{ ua.a|yesno:"T,F" }}</span>
{% else %} {% else %}
<span class="badge bg-danger">{{ ua.a|yesno:"T,F" }}</span> <span class="badge border border-danger text-danger bg-white">{{ ua.a|yesno:"T,F" }}</span>
{% endif %} {% endif %}
</div> </div>
<div class="d-flex align-items-center"> <div class="d-flex align-items-center">
<span class="me-1 small text-muted">B</span> <span class="me-1 small text-muted">B</span>
{% if ua.b is None %} {% if ua.b is None %}
<span class="badge bg-light text-muted">N/A</span> <span class="badge border border-secondary text-muted bg-white">N/A</span>
{% elif ua.b == question.b_answer %} {% elif ua.b == question.b_answer %}
<span class="badge bg-success">{{ ua.b|yesno:"T,F" }}</span> <span class="badge border border-success text-success bg-white">{{ ua.b|yesno:"T,F" }}</span>
{% else %} {% else %}
<span class="badge bg-danger">{{ ua.b|yesno:"T,F" }}</span> <span class="badge border border-danger text-danger bg-white">{{ ua.b|yesno:"T,F" }}</span>
{% endif %} {% endif %}
</div> </div>
<div class="d-flex align-items-center"> <div class="d-flex align-items-center">
<span class="me-1 small text-muted">C</span> <span class="me-1 small text-muted">C</span>
{% if ua.c is None %} {% if ua.c is None %}
<span class="badge bg-light text-muted">N/A</span> <span class="badge border border-secondary text-muted bg-white">N/A</span>
{% elif ua.c == question.c_answer %} {% elif ua.c == question.c_answer %}
<span class="badge bg-success">{{ ua.c|yesno:"T,F" }}</span> <span class="badge border border-success text-success bg-white">{{ ua.c|yesno:"T,F" }}</span>
{% else %} {% else %}
<span class="badge bg-danger">{{ ua.c|yesno:"T,F" }}</span> <span class="badge border border-danger text-danger bg-white">{{ ua.c|yesno:"T,F" }}</span>
{% endif %} {% endif %}
</div> </div>
<div class="d-flex align-items-center"> <div class="d-flex align-items-center">
<span class="me-1 small text-muted">D</span> <span class="me-1 small text-muted">D</span>
{% if ua.d is None %} {% if ua.d is None %}
<span class="badge bg-light text-muted">N/A</span> <span class="badge border border-secondary text-muted bg-white">N/A</span>
{% elif ua.d == question.d_answer %} {% elif ua.d == question.d_answer %}
<span class="badge bg-success">{{ ua.d|yesno:"T,F" }}</span> <span class="badge border border-success text-success bg-white">{{ ua.d|yesno:"T,F" }}</span>
{% else %} {% else %}
<span class="badge bg-danger">{{ ua.d|yesno:"T,F" }}</span> <span class="badge border border-danger text-danger bg-white">{{ ua.d|yesno:"T,F" }}</span>
{% endif %} {% endif %}
</div> </div>
<div class="d-flex align-items-center"> <div class="d-flex align-items-center">
<span class="me-1 small text-muted">E</span> <span class="me-1 small text-muted">E</span>
{% if ua.e is None %} {% if ua.e is None %}
<span class="badge bg-light text-muted">N/A</span> <span class="badge border border-secondary text-muted bg-white">N/A</span>
{% elif ua.e == question.e_answer %} {% elif ua.e == question.e_answer %}
<span class="badge bg-success">{{ ua.e|yesno:"T,F" }}</span> <span class="badge border border-success text-success bg-white">{{ ua.e|yesno:"T,F" }}</span>
{% else %} {% else %}
<span class="badge bg-danger">{{ ua.e|yesno:"T,F" }}</span> <span class="badge border border-danger text-danger bg-white">{{ ua.e|yesno:"T,F" }}</span>
{% endif %} {% endif %}
</div> </div>
</div> </div>
physics/templates/physics/partials/exam_review_question_summary_fragment.html
+20 -8
View File
@@ -6,12 +6,12 @@
{% if per_part_stats %} {% if per_part_stats %}
<div class="row mb-3"> <div class="row mb-3">
{% for part in per_part_stats %} {% for part in per_part_stats %}
{# colour by percent-correct: green >=75, warning >=50, red otherwise #}
<div class="col-md-2"> <div class="col-md-2">
<div class="card"> <div class="card">
<div class="card-body p-2 text-center"> <div class="card-body p-2 text-center {% if part.correct_pct >= 75 %}border border-success{% elif part.correct_pct >= 50 %}border border-warning{% elif part.correct_pct > 0 %}border border-danger{% endif %}">
<div class="small text-muted">{{ part.part|upper }}</div> <div class="small text-muted">{{ part.part|upper }}</div>
<div class="h5 mb-0">{{ part.true_count }} / {{ part.total }}</div> <div class="h5 mb-0">{{ part.correct_count }} / {{ part.total }}</div>
<div class="small text-muted">True: {{ part.pct_true }}%</div>
<div class="small text-muted">Correct: {{ part.correct_pct }}%</div> <div class="small text-muted">Correct: {{ part.correct_pct }}%</div>
</div> </div>
</div> </div>
@@ -42,13 +42,25 @@
{% if item.parts %} {% if item.parts %}
<div class="d-flex gap-1 align-items-center"> <div class="d-flex gap-1 align-items-center">
{% for part in item.parts %} {% for part in item.parts %}
{% if part.is_correct == True %} {% with pstats=per_part_stats|get_item:forloop.counter0 %}
<span class="badge bg-success">{{ part.value|yesno:"T,F" }}</span> {% if pstats %}
{% elif part.is_correct == False %} {% if pstats.correct_pct >= 75 %}
<span class="badge bg-danger">{{ part.value|yesno:"T,F" }}</span> <span class="badge border border-success text-success bg-white">{{ part.value|yesno:"T,F" }}</span>
{% elif pstats.correct_pct >= 50 %}
<span class="badge border border-warning text-warning bg-white">{{ part.value|yesno:"T,F" }}</span>
{% else %} {% else %}
<span class="badge bg-light text-muted">{{ part.value|default:"-" }}</span> <span class="badge border border-danger text-danger bg-white">{{ part.value|yesno:"T,F" }}</span>
{% endif %} {% endif %}
{% else %}
{% if part.is_correct == True %}
<span class="badge border border-success text-success bg-white">{{ part.value|yesno:"T,F" }}</span>
{% elif part.is_correct == False %}
<span class="badge border border-danger text-danger bg-white">{{ part.value|yesno:"T,F" }}</span>
{% else %}
<span class="badge border border-secondary text-muted bg-white">{{ part.value|default:"-" }}</span>
{% endif %}
{% endif %}
{% endwith %}
{% endfor %} {% endfor %}
</div> </div>
{% else %} {% else %}