improve exam list view

This commit is contained in:
Ross
2024-05-13 11:10:25 +01:00
parent b014722d2e
commit f37b3312e5
2 changed files with 24 additions and 4 deletions
+9
View File
@@ -681,6 +681,15 @@ input {
display: flex;
}
ul.exam-list {
padding-left: 0.5em;
padding-right: 0.5em;
}
.flex-col-half {
flex: 0.5;
}
.flex-col {
flex: 1;
}
+15 -4
View File
@@ -9,17 +9,18 @@
{% if exam.active %}
<li class="exam-item">
<a href="{% url app_name|add:':exam_overview' pk=exam.pk %}" class="flex-col-2 exam-name">{{exam.name}}</a>
{% if marking %}<a href="{% url app_name|add:':mark_overview' pk=exam.pk %}" class="flex-col">Mark</a>{% endif %}
{% if marking %}<a href="{% url app_name|add:':mark_overview' pk=exam.pk %}" class="flex-col-half">Mark</a>{% endif %}
<span class="flex-col">
<a href="{% url app_name|add:':exam_cids' exam_id=exam.pk %}">Candidates</a> <span class="candidate-counts">[<span title="Number of active CID users">
{{exam.valid_cid_users.count}}
</span> / <span title="Number of active User users">{{exam.valid_user_users.count}}]</span></span>
</span>
<a href="{% url app_name|add:':exam_scores_all' pk=exam.pk %}" class="flex-col">Scores</a>
<a href="{% url app_name|add:':exam_scores_all' pk=exam.pk %}" class="flex-col-half">Scores</a>
<input type="checkbox" id="active-{{exam.pk}}" class="exam-active-switch" data-posturl="{% url app_name|add:':exam_toggle_active' pk=exam.pk %}" {% if exam.active %}checked{% endif %}>
<label for="active-{{exam.pk}}" class="flex-col icon-container active-icon" title="Click to toggle active state">Exam Active</label>
<input type="checkbox" id="published-{{exam.pk}}" class="exam-publish-results-switch" data-posturl="{% url app_name|add:':exam_toggle_results_published' pk=exam.pk %}" {% if exam.publish_results %}checked{% endif %}>
<label for="published-{{exam.pk}}" class="flex-col icon-container published-icon" title="Click to toggle published state">Results Published</label>
<a href="{% url app_name|add:':exam_update' pk=exam.pk %}" class="flex-col exam-list-edit-button"><i class="bi bi-pencil-square"></i></a>
{% if view_all %}
<input type="checkbox" id="archived-{{exam.pk}}" class="exam-archived-switch" data-posturl="{% url app_name|add:':exam_toggle_archived' pk=exam.pk %}" {% if exam.archive %}checked{% endif %}>
<label for="archived-{{exam.pk}}" class="flex-col icon-archive archived-icon" title="Click to toggle archived state">Archived</label>
@@ -35,7 +36,7 @@
{% if not exam.active %}
<li class="exam-item">
<a href="{% url app_name|add:':exam_overview' pk=exam.pk %}" class="flex-col-2 exam-name">{{exam.name}}</a>
{% if marking %}<a href="{% url app_name|add:':mark_overview' pk=exam.pk %}" class="flex-col">Mark</a>{% endif %}
{% if marking %}<a href="{% url app_name|add:':mark_overview' pk=exam.pk %}" class="flex-col-half">Mark</a>{% endif %}
<span class="flex-col">
<a href="{% url app_name|add:':exam_cids' exam_id=exam.pk %}">Candidates</a>
<span class="candidate-counts">
@@ -46,11 +47,12 @@
</span>
</span>
</span>
<a href="{% url app_name|add:':exam_scores_all' pk=exam.pk %}" class="flex-col">Scores</a>
<a href="{% url app_name|add:':exam_scores_all' pk=exam.pk %}" class="flex-col-half">Scores</a>
<input type="checkbox" id="active-{{exam.pk}}" class="exam-active-switch" data-posturl="{% url app_name|add:':exam_toggle_active' pk=exam.pk %}" {% if exam.active %}checked{% endif %}>
<label for="active-{{exam.pk}}" class="flex-col icon-container active-icon" title="Click to toggle active state">Exam Active</label>
<input type="checkbox" id="{{exam.pk}}-pub" class="exam-publish-results-switch" data-posturl="{% url app_name|add:':exam_toggle_results_published' pk=exam.pk %}" {% if exam.publish_results %}checked{% endif %}>
<label for="{{exam.pk}}-pub" class="flex-col icon-container published-icon">Results Published</label>
<a href="{% url app_name|add:':exam_update' pk=exam.pk %}" class="flex-col exam-list-edit-button"><i class="bi bi-pencil-square"></i></a>
{% if view_all %}
<input type="checkbox" id="archived-{{exam.pk}}" class="exam-archived-switch" data-posturl="{% url app_name|add:':exam_toggle_archived' pk=exam.pk %}" {% if exam.archive %}checked{% endif %}>
<label for="archived-{{exam.pk}}" class="flex-col icon-archive archived-icon" title="Click to toggle archived state">Archived</label>
@@ -124,6 +126,15 @@
border: 1px dashed gray;
margin: -1px;
}
.exam-list-edit-button {
color: darkgray!important;
cursor: pointer;
opacity: 20%;
padding-inline-start: 10px;
}
.exam-list-edit-button:hover {
opacity: 100%;
}
</style>
{% endblock %}