blob: 9f2321e0ab3a93c6f1092faf07101b277967e659 [file] [log] [blame]
avm9996300a40032020-05-07 21:02:32 +02001<!DOCTYPE html>
2<html>
3 <head>
4 <meta charset="utf-8">
5 <title>COVID-19 sandbox</title>
6 <meta name="viewport" content="width=device-width, initial-scale=1">
7
8 <style>
9 body {
10 font-family: 'Helvetica', 'Arial', sans-serif;
avm999630b3b4072020-05-17 02:39:07 +020011 padding-bottom: 200px;
avm9996300a40032020-05-07 21:02:32 +020012 }
13
14 .graphs {
15 max-width: 100%;
16 }
17
18 .key-container {
19 display: inline-block;
20 position: fixed;
21 bottom: 8px;
22 right: 8px;
23 padding: 8px;
24
25 background: white;
26 border-radius: 4px;
27 }
28
29 .key-container h3 {
30 margin: 8px 0 12px 0;
31 }
32
33 .key {
34 border-collapse: collapse;
35 }
36
37 .key td {
38 border: solid 1px black;
39 padding: 2px;
40 }
41
42 .risk {
43 width: 40px;
44 }
45
46 .low-risk {
47 background-color: #a0ff94;
48 }
49
50 .intermediate-risk {
51 background-color: #dbff94;
52 }
53
54 .intermediate-high-risk {
55 background-color: #ffe494;
56 }
57
58 .high-risk {
59 background-color: #ff9494;
60 }
61 </style>
62 </head>
63 <body>
64 <img class="graphs" src="output/graph.svg">
65
66 <div class="key-container">
67 <h3>Llegenda</h3>
68 <table class="key">
69 <tr>
70 <td class="risk low-risk"></td>
71 <td>Risc baix</td>
72 </tr>
73 <tr>
74 <td class="risk intermediate-risk"></td>
avm9996358284b62020-05-07 21:30:33 +020075 <td>Risc mig</td>
avm9996300a40032020-05-07 21:02:32 +020076 </tr>
77 <tr>
78 <td class="risk intermediate-high-risk"></td>
avm9996358284b62020-05-07 21:30:33 +020079 <td>Risc mig-alt</td>
avm9996300a40032020-05-07 21:02:32 +020080 </tr>
81 <tr>
82 <td class="risk high-risk"></td>
83 <td>Risc alt</td>
84 </tr>
85 </table>
86 </div>
87 </body>
88</html>