benedikt/rki-impfparser
1
0
Fork 0
Code Releases Activity

feat: Added meters for vaccination rates

Browse source
This commit is contained in:
Benedikt Bastin 2021-02-02 12:57:50 +01:00
parent 61e6cb2806
commit ec2064fd6d
2 changed files with 40 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
dashboard_template.xhtml
View file

@ -33,6 +33,17 @@
Für die Zweitimpfungen sind am <em>{{ data_second_vaccination['extrapolation_mean_seven_days']['date_herd_immunity_str'] }}</em> {{ herd_immunity }} % erreicht und am <em>{{ data_second_vaccination['extrapolation_mean_seven_days']['date_done_str'] }}</em> 100 %.
</p>
</section>
<section>
<h1>Impffortschritt</h1>
<div class="labelled_meter">
<meter name="first_vaccination_percentage" value="{{ data_first_vaccination.total_percentage }}" max="100" title="{{ '{:.3n}'.format(data_first_vaccination.total_percentage) }} %"/>
<label for="first_vaccination_percentage">Erstimpfungen: <em>{{ '{:.3n}'.format(data_first_vaccination.total_percentage) }} %</em></label>
</div>
<div class="labelled_meter">
<meter name="second_vaccination_percentage" value="{{ data_second_vaccination.total_percentage }}" max="100" title="{{ '{:.3n}'.format(data_second_vaccination.total_percentage) }} %"/>
<label for="second_vaccination_percentage">Zweitimpfungen: <em>{{ '{:.3n}'.format(data_second_vaccination.total_percentage) }} %</em></label>
</div>
</section>
<!--<section>
<h1>Details</h1>
<figure>

29
site/rki-dashboard.css
View file

@ -43,7 +43,36 @@ sup {
user-select: none;
}
.labelled_meter {
display: flex;
flex-wrap: wrap;
padding: 0.1em;
}
.labelled_meter meter {
min-width: 250px;
height: 1.5em;
background: white;
border: 1px solid #999999;
flex-grow: 2;
}
.labelled_meter label {
width: 200px;
padding: 0.1em;
wrap: nowrap;
hyphens: none;
}
.labelled_meter label em {
font-weight: inherit;
font-style: inherit;
/*color: #ffac12;*/
color: #333333;
/*background-image: linear-gradient(rgba(255, 255, 255, 0) 90%, #f7bb3c 91%, #f7bb3c 98%, rgba(255, 255, 255, 0) 99%);*/
text-decoration: underline;
text-decoration-color: #ffac12;
}
figure {
max-width: 100%;