Skip to content

Commit 558d654

Browse files
committed
Upgrade to Bootstrap 5
1 parent 0f50ceb commit 558d654

File tree

3 files changed

+181
-188
lines changed

3 files changed

+181
-188
lines changed

graderutils_format/templates/base.html

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -11,19 +11,19 @@
1111
integrity="sha256-u7e5khyithlIdTpu22PHhENmPcRdFiHRjhAuHcs05RI="
1212
crossorigin="anonymous"></script>
1313
<link rel="stylesheet"
14-
href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css"
15-
integrity="sha384-HSMxcRTRxnN+Bdg0JdbxYKrThecOKuH5zCYotlSAcp1+c8xmyTe9GYg1l9a69psu"
16-
crossorigin="anonymous">
14+
href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css"
15+
integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH"
16+
crossorigin="anonymous">
1717
</head>
1818

1919
<body>
2020
<div class="container">
2121
{% block body %}
2222
{% endblock %}
2323
</div>
24-
<script src="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"
25-
integrity="sha384-aJ21OjlMXNL5UyIl/XNwTMqvzeRMZH2w8c5cRVpzpU8Y5bApTppSuUkhZXN0VxHd"
26-
crossorigin="anonymous"></script>
24+
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.min.js"
25+
integrity="sha384-0pUGZvbkm6XF6gxjEnlmuGrJXVbNuzT9qBBavbLwCsOGabYfZo0T0to5eqruptLy"
26+
crossorigin="anonymous"></script>
2727
</body>
2828

2929
</html>
Lines changed: 37 additions & 53 deletions
Original file line numberDiff line numberDiff line change
@@ -1,32 +1,21 @@
11
/* Increase size of labels in grader result panels */
2+
div.grading-feedback h4 {
3+
margin-top: 0;
4+
}
25
span.feedback-label {
36
font-size: 14px;
47
}
5-
/* Add space between different test groups */
6-
div.grading-task {
7-
margin-top: 40px;
8-
margin-bottom: 40px;
9-
}
10-
/* Add more separation between last test group and unittest terminal output */
11-
div.full-test-output {
12-
margin-top: 35px;
13-
}
14-
/* Bootstrap h4 bottom margins are by default a bit too small */
15-
h4.testgroup-header {
16-
margin-bottom: 20px;
17-
}
188
/* Disable automatic horizontal scroll of preformatted text blocks */
199
div.pre-wrap pre {
2010
white-space: pre-wrap;
11+
border: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color);
12+
background-color: var(--bs-tertiary-bg);
2113
}
22-
div.warning-messages {
23-
margin-top: 35px;
24-
}
25-
div.grader-info {
26-
color: gray;
14+
div.pre-wrap pre:last-of-type {
15+
margin-block: 0px 0px;
2716
}
2817
span.iotester-warning {
29-
color: red;
18+
color: var(--bs-danger);
3019
}
3120
span.iotester-basic {
3221
color: #a5409e;
@@ -38,44 +27,39 @@ span.iotester-correct {
3827
background-color: #8cde8c;
3928
}
4029
span.iotester-input {
41-
background-color: #49d8ff;
30+
background-color: #7ed9f5;
4231
}
43-
/* Traceback button top margin is by default a bit too small */
44-
button.btn-traceback {
45-
margin-top: 10px;
32+
[data-bs-theme="dark"] span.iotester-basic {
33+
color: #d0a7ff;
4634
}
47-
/* A table is used for wrapping long panel text to multiple lines and to prevent it from pushing badges and labels down */
48-
div.panel-default > .panel-heading {
49-
display: table;
50-
width: 100%;
35+
[data-bs-theme="dark"] span.iotester-incorrect {
36+
background-color: #8b2e2e;
5137
}
52-
/* Table cell for the text part of panel titles */
53-
div.panel-text {
54-
display: table-cell;
38+
[data-bs-theme="dark"] span.iotester-correct {
39+
background-color: #1e6e1e;
5540
}
56-
/* Vertically center and reserve space for the badges and labels of panel titles */
57-
div.panel-annotation {
58-
display: table-cell;
59-
vertical-align: middle;
60-
min-width: 200px;
41+
[data-bs-theme="dark"] span.iotester-input {
42+
background-color: #0e5a8a;
6143
}
62-
/* Add space between panel titles and points badges, and increase badge size */
63-
div.grading-task .panel-default > .panel-heading .badge {
44+
div.grading-feedback .accordion-header .badge {
6445
font-size: 14px;
65-
margin-right: 10px;
66-
}
67-
/* Green color for badges and labels when tests pass */
68-
div.grading-task .panel-default > .panel-heading .color-passed {
69-
color: #fff;
70-
background-color: #00803c;
71-
}
72-
/* Red color for badges and labels when tests fail */
73-
div.grading-task .panel-default > .panel-heading .color-failed {
74-
color: #fff;
75-
background-color: #a50000;
76-
}
77-
/* Orange color for badges and labels when errors occur */
78-
div.grading-task .panel-default > .panel-heading .color-error {
79-
color: #fff;
80-
background-color: #a6670e;
46+
}
47+
span.panel-title {
48+
color: rgba(var(--bs-link-color-rgb), var(--bs-link-opacity, 1));
49+
font-weight: 700;
50+
}
51+
/* Fix borders with vertically spaced accordion */
52+
div.spaced-accordion > .accordion-item {
53+
border: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color);
54+
border-radius: var(--bs-accordion-border-radius);
55+
margin-top: 1rem;
56+
}
57+
div.spaced-accordion > .accordion-item > .accordion-header > .accordion-button:not(.collapsed) {
58+
border-top-left-radius: var(--bs-accordion-border-radius);
59+
border-top-right-radius: var(--bs-accordion-border-radius);
60+
border-bottom-left-radius: 0;
61+
border-bottom-right-radius: 0;
62+
}
63+
div.spaced-accordion > .accordion-item > .accordion-header > .accordion-button.collapsed {
64+
border-radius: var(--bs-accordion-border-radius);
8165
}

0 commit comments

Comments
 (0)