Commit 4aee2d63f578a0bc619b40c7c81b46b3f4b749c6

Authored by Miguel Barão
1 parent 1fa9c011
Exists in master and in 1 other branch dev

update html templates to latest bootstrap5

replace fontawesome by bootstrap-icons
cosmetic changes
perguntations/static/fontawesome-free
... ... @@ -1 +0,0 @@
1   -../../node_modules/@fortawesome/fontawesome-free/
2 0 \ No newline at end of file
perguntations/templates/grade.html
... ... @@ -33,13 +33,14 @@
33 33  
34 34 <ul class="nav navbar-nav mx-auto">
35 35 <li class="nav-item">
36   - <span class="navbar-text">{{ t['title'] }}</span>
  36 + <span class="navbar-text">Resultado</span>
37 37 </li>
38 38 </ul>
39 39  
40 40 <ul class="nav navbar-nav">
41 41 <li class="nav-item">
42 42 <span class="navbar-text">
  43 + <i class="bi bi-person-fill"></i>
43 44 <span id="name">{{ escape(name) }}</span>
44 45 (<span id="number">{{ escape(uid) }}</span>)
45 46 </span>
... ... @@ -49,22 +50,56 @@
49 50 </div>
50 51 </nav>
51 52 <!-- ================================================================== -->
52   - <div class="container">
53   - <div class="bg-light p-3">
  53 +<div class="container">
  54 + <div class="card">
  55 + <h5 class="card-header">{{ t['title'] }}</h5>
  56 + <div class="card-body">
  57 + <div class="row">
  58 + <label for="nome" class="col-3">Nome:</label>
  59 + <div class="col-9" id="nome">{{ escape(name) }}</div>
  60 + </div>
  61 + <div class="row">
  62 + <label for="numero" class="col-3">Número:</label>
  63 + <div class="col-9" id="numero">{{ escape(uid) }}</div>
  64 + </div>
  65 + <div class="row">
  66 + <label for="duracao" class="col-3">Duração:</label>
  67 + <div class="col-9" id="duracao">{{ str(t['duration'])+' minutos' if t['duration'] > 0 else 'sem limite de tempo' }}</div>
  68 + </div>
  69 + <div class="row">
  70 + <label for="submissao" class="col-3">Submissão:</label>
  71 + <div class="col-9" id="submissao">{{ 'automática no fim do tempo' if t['autosubmit'] else 'manual' }}</div>
  72 + </div>
  73 + <div class="row">
  74 + <label for="start_time" class="col-3">Início:</label>
  75 + <div class="col-9 font-monospace" id="start_time">{{ t['start_time'] }}</div>
  76 + </div>
  77 + <div class="row">
  78 + <label for="finish_time" class="col-3">Fim:</label>
  79 + <div class="col-9 font-monospace" id="finish_time">{{ t['finish_time'] }}</div>
  80 + </div>
  81 + </div>
  82 + <div class="card-footer">
54 83 {% if t['state'] == 'CORRECTED' %}
55   - <h3>Nota: <strong>{{ f'{round(t["grade"], 3)}' }}</strong> valores</h3>
  84 + <div class="row">
  85 + <label for="nota" class="col-3">Nota:</label>
  86 + <div class="col-9" id="nota">
  87 + <strong>{{ f'{round(t["grade"], 3)}' }}</strong> valores
  88 + </div>
  89 + </div>
56 90 {% elif t['state'] == 'SUBMITTED' %}
57   - <h3>A prova foi submetida com sucesso. Vai ser corrigida mais tarde.</h3>
  91 + A prova foi submetida com sucesso. Vai ser corrigida mais tarde.
58 92 {% elif t['state'] == 'QUIT' %}
59   - <h3>Foi registada a sua desistência da prova.</h3>
  93 + Foi registada a sua desistência da prova.
60 94 {% end %}
61   -
62   - <p>
63   - <a href="/logout" class="btn btn-primary btn-lg active" role="button">
64   - Sair
65   - </a>
66   - </p>
67   - </div> <!-- panel -->
68   - </div> <!-- container -->
  95 + </div>
  96 + </div> <!-- card -->
  97 + <div class="d-grid gap-2">
  98 + <a href="/logout" class="btn btn-primary btn-lg active" role="button">
  99 + Sair do teste
  100 + </a>
  101 + <!-- <button class="btn btn-primary" type="button">Button</button> -->
  102 + </div>
  103 +</div> <!-- container -->
69 104 </body>
70 105 </html>
... ...
perguntations/templates/question.html
... ... @@ -4,7 +4,7 @@
4 4 <div class="card border-dark">
5 5 <h5 class="card-header text-white bg-dark">
6 6 {{ q['number'] }}. {{ q['title'] }}
7   - <div class="float-right">
  7 + <div class="float-end">
8 8 <small>Classificar&nbsp;</small>
9 9 <input type="checkbox" class="question_disabler" data-size="mini" name="answered-{{i}}" id="answered-{{i}}" checked="">
10 10 </div>
... ... @@ -16,7 +16,7 @@
16 16  
17 17 {% block answer %}{% end %}
18 18  
19   - <p class="text-right">
  19 + <p class="text-end">
20 20 <small>
21 21 {% if q['type'] == 'radio' %}
22 22 (Cotação: {{ -round(q['points']/(len(q['options'])-1), 2) }} a {{ round(q['points'], 2) }} pontos)
... ...
perguntations/templates/review-question-checkbox.html
... ... @@ -15,13 +15,13 @@
15 15 {{ md(opt) }}
16 16 </div>
17 17 <div class="ms-auto p-2">
18   - <div class="text-end">
  18 + <h3>
19 19 {% if q['correct'][n] > 0 %}
20   - <i class="bi bi-check-lg text-success"></i>
  20 + <i class="bi bi-check-lg text-success"></i>
21 21 {% else %}
22   - <i class="bi bi-x-lg text-danger"></i>
  22 + <i class="bi bi-x-lg text-danger"></i>
23 23 {% end %}
24   - </div>
  24 + </h3>
25 25 </div>
26 26  
27 27 {% else %}
... ... @@ -32,13 +32,13 @@
32 32 {{ md(opt) }}
33 33 </div>
34 34 <div class="ms-auto p-2">
35   - <div class="text-end">
36   - {% if q['correct'][n] > 0 %}
  35 + <h3>
  36 + {% if q['correct'][n] > 0 %}
37 37 <i class="bi bi-x-lg text-danger"></i>
38   - {% else %}
  38 + {% else %}
39 39 <i class="bi bi-check-lg text-success"></i>
40   - {% end %}
41   - </div>
  40 + {% end %}
  41 + </h3>
42 42 </div>
43 43 {% end %}
44 44 </div>
... ...
perguntations/templates/review-question-radio.html
... ... @@ -9,17 +9,19 @@
9 9 <div class="d-flex flex-row">
10 10 {% if q['answer'] is not None and str(n)==q['answer'] %}
11 11 <div class="p-2">
12   - <i class="bi bi-record-circle"></i>
  12 + <i class="bi bi-record-circle-fill"></i>
13 13 </div>
14 14 <div class="p-2">
15 15 {{ md(opt) }}
16 16 </div>
17 17 <div class="ms-auto p-2">
  18 + <h3>
18 19 {% if q['correct'][n] > 0 %}
19 20 <i class="bi bi-check-lg text-success"></i>
20 21 {% else %}
21 22 <i class="bi bi-x-lg text-danger"></i>
22 23 {% end %}
  24 + </h3>
23 25 </div>
24 26  
25 27 {% else %}
... ... @@ -31,7 +33,9 @@
31 33 </div>
32 34 <div class="ms-auto p-2">
33 35 {% if q['correct'][n] > 0 %}
  36 + <h3>
34 37 <i class="bi bi-arrow-left text-info"></i>
  38 + </h3>
35 39 {% end %}
36 40 </div>
37 41 {% end %}
... ...
perguntations/templates/review-question.html
... ... @@ -3,12 +3,12 @@
3 3 {% block question %}
4 4 {% if q['answer'] is not None %}
5 5  
6   - <div class="card border-dark mb-3">
7   - <h5 class="card-header text-white bg-dark">
  6 + <div class="card border-dark">
  7 + <h5 class="card-header text-light bg-dark">
8 8 {{ q['number'] }}. {{ q['title'] }}
9 9 <div class="float-end">
10   - <small>Classificada&nbsp;</small>
11   - <i class="bi bi-toggle2-on"></i>
  10 + <small>Classificar&nbsp;</small>
  11 + <i class="bi bi-check-square"></i>
12 12 </div>
13 13 </h5> <!-- card-header -->
14 14  
... ... @@ -19,7 +19,7 @@
19 19  
20 20 {% block answer %}{% end %}
21 21  
22   - <p class="text-right">
  22 + <p class="text-end">
23 23 <small>
24 24 {% if q['type'] == 'radio' %}
25 25 (Cotação: {{ -round(q['points']/(len(q['options'])-1), 2) }} a {{ round(q['points'], 2) }} pontos)
... ... @@ -35,7 +35,7 @@
35 35 {% if 'grade' in q %}
36 36 <div class="card-footer">
37 37 {% if q['grade'] > 0.999 %}
38   - <h1 class="text-success"><i class="bi bi-hand-thumbs-up"></i></h1>
  38 + <h1 class="text-success"><i class="bi bi-hand-thumbs-up-fill"></i></h1>
39 39 <p class="text-success">
40 40 {{ round(q['grade'] * q['points'], 2) }} pontos
41 41 </p>
... ... @@ -73,12 +73,12 @@
73 73  
74 74 {% else %}
75 75  
76   - <div class="card border-secondary mb-3">
77   - <h5 class="card-header text-white bg-secondary">
  76 + <div class="card border-secondary">
  77 + <h5 class="card-header text-secondary bg-light">
78 78 {{ q['number'] }}. {{ q['title'] }}
79 79 <div class="float-end">
80   - <small>Não classificada</small>
81   - <i class="bi bi-toggle2-off"></i>
  80 + <small>Classificar</small>
  81 + <i class="bi bi-square"></i>
82 82 </div>
83 83 </h5> <!-- card-header -->
84 84  
... ... @@ -89,14 +89,14 @@
89 89  
90 90 {% block answer %}{% end %}
91 91  
92   - <p class="text-right">
  92 + <p class="text-end">
93 93 <small>
94 94 (Cotação: {{ round(q['points'], 2) }})
95 95 </small>
96 96 </p>
97 97 </div> <!-- card-body -->
98 98  
99   - <div class="card-footer">
  99 + <div class="card-footer text-secondary">
100 100 {{ md(q['comments']) }}
101 101 {% if q['solution'] %}
102 102 {{ md('**Solução:** \n\n' + q['solution']) }}
... ...
perguntations/templates/review.html
1 1 <!DOCTYPE html>
2 2 <html lang="pt-PT">
3 3 <head>
4   - <title>Teste</title>
5   - <meta charset="UTF-8">
6   - <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
7   - <link rel="icon" type="image/x-icon" href="/static/favicon.ico">
  4 + <title>Revisão de prova</title>
  5 + <meta charset="utf-8">
  6 + <meta name="viewport" content="width=device-width, initial-scale=1">
  7 + <link rel="icon" href="/static/favicon.ico">
  8 +
  9 +<!-- Styles -->
  10 + <link rel="stylesheet" type="text/css" href="/static/bootstrap/css/bootstrap.min.css">
  11 + <link rel="stylesheet" type="text/css" href="/static/bootstrap-icons/font/bootstrap-icons.css">
  12 + <link rel="stylesheet" type="text/css" href="/static/css/github.css"> <!-- syntax highlight -->
  13 + <link rel="stylesheet" type="text/css" href="/static/css/test.css">
  14 +
8 15 <!-- MathJax3 -->
9 16 <script>
10 17 MathJax = {
... ... @@ -16,15 +23,7 @@
16 23 }
17 24 };
18 25 </script>
19   - <script type="text/javascript" id="MathJax-script" async
20   - src="/static/mathjax/es5/tex-svg.js">
21   - </script>
22   -
23   -<!-- Styles -->
24   - <link rel="stylesheet" type="text/css" href="/static/bootstrap/css/bootstrap.min.css">
25   - <link rel="stylesheet" type="text/css" href="/static/bootstrap-icons/font/bootstrap-icons.css">
26   - <link rel="stylesheet" type="text/css" href="/static/css/github.css"> <!-- syntax highlight -->
27   - <link rel="stylesheet" type="text/css" href="/static/css/test.css">
  26 + <script async type="text/javascript" id="MathJax-script" src="/static/mathjax/es5/tex-svg.js"></script>
28 27  
29 28 <!-- Scripts -->
30 29 <script src="/static/jquery/jquery.min.js"></script>
... ... @@ -56,6 +55,7 @@
56 55 <ul class="nav navbar-nav">
57 56 <li class="nav-item">
58 57 <span class="navbar-text">
  58 + <i class="bi bi-person-fill"></i>
59 59 <span id="name">{{ escape(name) }}</span>
60 60 (<span id="number">{{ escape(uid) }}</span>)
61 61 </span>
... ... @@ -67,50 +67,53 @@
67 67  
68 68 <!-- ===================================================================== -->
69 69 <div class="container">
70   - <div class="bg-light p-3">
71   - <h1 class="display-5">{{ t['title'] }}</h1>
72   - <hr>
73   - <div class="row">
74   - <label for="nome" class="col-sm-2">Nome:</label>
75   - <div class="col-sm-9" id="nome">{{ escape(name) }}</div>
76   - </div>
77   - <div class="row">
78   - <label for="numero" class="col-sm-2">Número:</label>
79   - <div class="col-sm-9" id="numero">{{ escape(uid) }}</div>
80   - </div>
81   - <div class="row">
82   - <label for="duracao" class="col-sm-2">Duração:</label>
83   - <div class="col-sm-10" id="duracao">
84   - {{ str(t.get('duration', 0)) + ' minutos' if t.get('duration', 0) > 0 else '+'+chr(8734) }}
  70 + <div class="card">
  71 + <h5 class="card-header">{{ t['title'] }}</h5>
  72 + <div class="card-body">
  73 + <div class="row">
  74 + <label for="nome" class="col-3">Nome:</label>
  75 + <div class="col-9" id="nome">{{ escape(name) }}</div>
85 76 </div>
86   - </div>
87   - <div class="row">
88   - <label for="inicio" class="col-sm-2">Início:</label>
89   - <div class="col-sm-10" id="inicio">{{t['start_time'][:19]}}</div>
90   - </div>
91   - <div class="row">
92   - <label for="fim" class="col-sm-2">Fim:</label>
93   - <div class="col-sm-10" id="fim">{{t['finish_time'][:19]}}</div>
94   - </div>
95   - <div class="row">
96   - <label for="nota" class="col-sm-2">Nota:</label>
97   - <div class="col-sm-10" id="nota">
98   - {% if t['state'] == 'CORRECTED' %}
99   - <strong>{{ round(t['grade'], 2) }}</strong> valores
100   - {% elif t['state'] == 'SUBMITTED' %}
101   - (não corrigido)
102   - {% elif t['state'] == 'QUIT' %}
103   - (DESISTIU)
104   - {% end %}
  77 + <div class="row">
  78 + <label for="numero" class="col-3">Número:</label>
  79 + <div class="col-9" id="numero">{{ escape(uid) }}</div>
105 80 </div>
106   - </div>
107   - {% if t['comment'] != '' %}
108 81 <div class="row">
109   - <label for="comentario" class="col-sm-2">Comentário:</label>
110   - <div class="col-sm-10" id="comentario">{{ t['comment'] }}</div>
  82 + <label for="duracao" class="col-3">Duração:</label>
  83 + <div class="col-9" id="duracao">
  84 + {{ str(t.get('duration', 0)) + ' minutos' if t.get('duration', 0) > 0 else 'sem limite' }}
  85 + </div>
111 86 </div>
112   - {% end %}
113   - </div>
  87 + <div class="row">
  88 + <label for="inicio" class="col-3">Início:</label>
  89 + <div class="col-9" id="inicio">{{t['start_time'][:19]}}</div>
  90 + </div>
  91 + <div class="row">
  92 + <label for="fim" class="col-3">Fim:</label>
  93 + <div class="col-9" id="fim">{{t['finish_time'][:19]}}</div>
  94 + </div>
  95 + </div> <!-- card-body -->
  96 + <div class="card-footer">
  97 + <div class="row">
  98 + <label for="nota" class="col-3">Nota:</label>
  99 + <div class="col-9" id="nota">
  100 + {% if t['state'] == 'CORRECTED' %}
  101 + <strong>{{ round(t['grade'], 2) }}</strong> valores
  102 + {% elif t['state'] == 'SUBMITTED' %}
  103 + (não corrigido)
  104 + {% elif t['state'] == 'QUIT' %}
  105 + (DESISTIU)
  106 + {% end %}
  107 + </div>
  108 + </div>
  109 + {% if t['comment'] != '' %}
  110 + <div class="row">
  111 + <label for="comentario" class="col-3">Comentário:</label>
  112 + <div class="col-9" id="comentario">{{ t['comment'] }}</div>
  113 + </div>
  114 + {% end %}
  115 + </div> <!-- card-footer -->
  116 + </div> <!-- card -->
114 117  
115 118 {% for i, q in enumerate(t['questions']) %}
116 119 {% module Template(templ[q['type']], i=i, q=q, md=md(q['ref']), t=t, debug=debug) %}
... ...
perguntations/templates/test.html
... ... @@ -8,6 +8,7 @@
8 8  
9 9 <!-- Styles -->
10 10 <link rel="stylesheet" type="text/css" href="/static/bootstrap/css/bootstrap.min.css">
  11 + <link rel="stylesheet" type="text/css" href="/static/bootstrap-icons/font/bootstrap-icons.css">
11 12 <link rel="stylesheet" type="text/css" href="/static/codemirror/lib/codemirror.css">
12 13 <link rel="stylesheet" type="text/css" href="/static/codemirror/theme/darcula.css">
13 14 <link rel="stylesheet" type="text/css" href="/static/css/github.css"> <!-- syntax highlight -->
... ... @@ -61,16 +62,15 @@
61 62 </ul>
62 63  
63 64 <ul class="nav navbar-nav mx-auto">
64   - <li class="nav-item"><h5>
65   - <span class="navbar-text" id="clock"> --:-- </span>
66   - </h5>
67   -
  65 + <li class="nav-item">
  66 + <h5> <span class="navbar-text" id="clock"> --:-- </span> </h5>
68 67 </li>
69 68 </ul>
70 69  
71 70 <ul class="nav navbar-nav">
72 71 <li class="nav-item">
73 72 <span class="navbar-text">
  73 + <i class="bi bi-person-fill"></i>
74 74 <span id="name">{{ escape(name) }}</span>
75 75 (<span id="number">{{ escape(uid) }}</span>)
76 76 </span>
... ... @@ -82,25 +82,25 @@
82 82  
83 83 <!-- ===================================================================== -->
84 84 <div class="container">
85   -
86   - <div class="bg-light p-3">
87   - <h3 class="display-5">{{ t['title'] }}</h3>
88   - <hr>
89   - <div class="row">
90   - <label for="nome" class="col-sm-3">Nome:</label>
91   - <div class="col-sm-9" id="nome">{{ escape(name) }}</div>
92   - </div>
93   - <div class="row">
94   - <label for="numero" class="col-sm-3">Número:</label>
95   - <div class="col-sm-9" id="numero">{{ escape(uid) }}</div>
96   - </div>
97   - <div class="row">
98   - <label for="duracao" class="col-sm-3">Duração:</label>
99   - <div class="col-sm-9" id="duracao">{{ str(t['duration'])+' minutos' if t['duration'] > 0 else 'sem limite de tempo' }}</div>
100   - </div>
101   - <div class="row">
102   - <label for="submissao" class="col-sm-3">Submissão:</label>
103   - <div class="col-sm-9" id="submissao">{{ 'automática no fim do tempo' if t['autosubmit'] else 'manual' }}</div>
  85 + <div class="card">
  86 + <h5 class="card-header">{{ t['title'] }}</h5>
  87 + <div class="card-body">
  88 + <div class="row">
  89 + <label for="nome" class="col-3">Nome:</label>
  90 + <div class="col-9" id="nome">{{ escape(name) }}</div>
  91 + </div>
  92 + <div class="row">
  93 + <label for="numero" class="col-3">Número:</label>
  94 + <div class="col-9" id="numero">{{ escape(uid) }}</div>
  95 + </div>
  96 + <div class="row">
  97 + <label for="duracao" class="col-3">Duração:</label>
  98 + <div class="col-9" id="duracao">{{ str(t['duration'])+' minutos' if t['duration'] > 0 else 'sem limite' }}</div>
  99 + </div>
  100 + <div class="row">
  101 + <label for="submissao" class="col-3">Submissão:</label>
  102 + <div class="col-9" id="submissao">{{ 'automática no fim do tempo' if t['autosubmit'] else 'manual' }}</div>
  103 + </div>
104 104 </div>
105 105 </div>
106 106  
... ... @@ -111,12 +111,10 @@
111 111 {% module Template(templ[q['type']], i=i, q=q, md=md(q['ref']), debug=debug) %}
112 112 {% end %}
113 113  
114   - <div class="form-row">
115   - <div class="col-12">
116   - <button type="button" class="btn btn-success btn-lg btn-block" data-bs-toggle="modal" data-bs-target="#confirmar" id="form-button-submit">
117   - Submeter teste
118   - </button>
119   - </div>
  114 + <div class="d-grid gap-2">
  115 + <button type="button" class="btn btn-success btn-lg btn-block" data-bs-toggle="modal" data-bs-target="#confirmar" id="form-button-submit">
  116 + Submeter teste
  117 + </button>
120 118 </div>
121 119 </form>
122 120 <hr>
... ...