Skip to content
Snippets Groups Projects
Commit ec199296 authored by Jan Hartig's avatar Jan Hartig
Browse files

Resolve "Accessibility"

parent ce36929d
No related branches found
No related tags found
1 merge request!7Resolve "Accessibility"
......@@ -30,6 +30,11 @@
.transition-opacity {
transition: opacity .25s ease-in;
}
.link-secondary {
color: #495057 !important;
}
{% block extra_css %}{% endblock %}
</style>
</head>
......@@ -39,14 +44,14 @@
<div class="py-5 text-center">
<img class="d-block mx-auto mb-4" src="{{ url_for('static', filename='img/logo.svg') }}" alt="PTB Logo"
width="96" height="96">
<h2>{{ config["LOCALISATIONS"]["title"][request.language] }}</h2>
<h1 class="h2">{{ config["LOCALISATIONS"]["title"][request.language] }}</h1>
<p class="lead">{% autoescape false %}{{ config["LOCALISATIONS"]["leadtext"][request.language] }}{% endautoescape %}</p>
</div>
{% block content %}{% endblock %}
</main>
<footer class="footer mt-auto">
<div class="container text-muted text-center text-small">
<div class="container text-center text-small">
<p class="mb-1">
{% for l in config["ENABLED_LOCALISATIONS"] %}
{% if request.language == l -%}{{ l }}
......
......@@ -3,7 +3,7 @@
{% block content %}
<div class="pt-5 text-center">
<img class="mx-auto mb-4 spinner processing transition-opacity" src="{{ url_for('static', filename='img/arrow-repeat.svg') }}" alt="Spinning arrow" height="136" aria-hidden="true">
<img class="mx-auto mb-4 success hidden transition-opacity" src="{{ url_for('static', filename='img/cloud-check.svg') }}" alt="Checkmark" height="136" aria-hidden="true" hidden>
<img class="mx-auto mb-4 success hidden transition-opacity" src="{{ url_for('static', filename='img/cloud-check.svg') }}" alt="Cloud with checkmark" height="136" aria-hidden="true" hidden>
<p class="pt-4 lead processing transition-opacity">{% autoescape false %}{{ config["LOCALISATIONS"]["processingtext"][request.language] }}{% endautoescape %}</p>
<p class="pt-4 lead success hidden transition-opacity" hidden>{% autoescape false %}{{ config["LOCALISATIONS"]["successtext"][request.language] }}{% endautoescape %}</p>
<a class="pt-4 fs-1 lead success hidden transition-opacity icon-link icon-link-hover link-offset-2" style="--bs-icon-link-transform: translate3d(-.125rem, 0, 0);" href="{{ url_for('upload', language=request.language) }}">
......
......@@ -11,16 +11,16 @@
{% else %}
{{ form.email.label(class="form-label") }}
{% endif %}
<a class="d-inline-block" tabindex="0" data-bs-toggle="popover" data-bs-trigger="hover focus" data-bs-placement="top" data-bs-custom-class="custom-popover" data-bs-delay='{"show":0,"hide":150}' data-bs-content="{{ config["LOCALISATIONS"]["email"]["helptext"][request.language] }}">
<img src="{{ url_for('static', filename='img/info-circle-fill.svg') }}" alt="Checkmark" height="16" style="vertical-align: -0.155em;">
<a class="d-inline-block" data-bs-toggle="popover" data-bs-trigger="hover focus" data-bs-placement="top" data-bs-custom-class="custom-popover" data-bs-delay='{"show":0,"hide":150}' data-bs-content="{{ config["LOCALISATIONS"]["email"]["helptext"][request.language] }}">
<img src="{{ url_for('static', filename='img/info-circle-fill.svg') }}" alt="Info circle" height="16" style="vertical-align: -0.155em;">
</a>
<div class="input-group">
{% if form.email.errors %}
{{ form.email(class="form-control is-invalid", placeholder=config["LOCALISATIONS"]["email"]["placeholder"][request.language]) }}
<input class="form-control is-invalid" id="email" name="email" placeholder="{{ config["LOCALISATIONS"]["email"]["placeholder"][request.language] }}" required="" type="text" value="" aria-label="{{ config["LOCALISATIONS"]["email"]["helptext"][request.language] }}">
{% elif form.language.data %}
{{ form.email(class="form-control is-valid", placeholder=config["LOCALISATIONS"]["email"]["placeholder"][request.language]) }}
<input class="form-control is-valid" id="email" name="email" placeholder="{{ config["LOCALISATIONS"]["email"]["placeholder"][request.language] }}" required="" type="text" value="" aria-label="{{ config["LOCALISATIONS"]["email"]["helptext"][request.language] }}">
{% else %}
{{ form.email(class="form-control", placeholder=config["LOCALISATIONS"]["email"]["placeholder"][request.language]) }}
<input class="form-control" id="email" name="email" placeholder="{{ config["LOCALISATIONS"]["email"]["placeholder"][request.language] }}" required="" type="text" value="" aria-label="{{ config["LOCALISATIONS"]["email"]["helptext"][request.language] }}">
{% endif %}
<span class="input-group-text">@ptb.de</span>
{% if form.email.errors %}
......@@ -36,15 +36,15 @@
<div class="row justify-content-center">
<div class="col-sm-3 col-md-2 pt-2">
{{ form.language.label(class="form-label") }}
<a class="d-inline-block" tabindex="0" data-bs-toggle="popover" data-bs-trigger="hover focus" data-bs-placement="top" data-bs-custom-class="custom-popover" data-bs-delay='{"show":0,"hide":150}' data-bs-html="true" data-bs-content="{{ config["LOCALISATIONS"]["language"]["helptext"][request.language] }}">
<img src="{{ url_for('static', filename='img/info-circle-fill.svg') }}" alt="Checkmark" height="16" style="vertical-align: -0.155em;">
<a class="d-inline-block" data-bs-toggle="popover" data-bs-trigger="hover focus" data-bs-placement="top" data-bs-custom-class="custom-popover" data-bs-delay='{"show":0,"hide":150}' data-bs-html="true" data-bs-content="{{ config["LOCALISATIONS"]["language"]["helptext"][request.language] }}">
<img src="{{ url_for('static', filename='img/info-circle-fill.svg') }}" alt="Info circle" height="16" style="vertical-align: -0.155em;">
</a>
{% if form.language.errors %}
<select class="form-select is-invalid" id="{{ form.language.id }}" name="{{ form.language.name }}" required>
<select class="form-select is-invalid" id="{{ form.language.id }}" name="{{ form.language.name }}" required aria-label="{{ config["LOCALISATIONS"]["language"]["helptext"][request.language] }}">
{% elif form.language.data %}
<select class="form-select is-valid" id="{{ form.language.id }}" name="{{ form.language.name }}" required>
<select class="form-select is-valid" id="{{ form.language.id }}" name="{{ form.language.name }}" required aria-label="{{ config["LOCALISATIONS"]["language"]["helptext"][request.language] }}">
{% else %}
<select class="form-select" id="{{ form.language.id }}" name="{{ form.language.name }}" required>
<select class="form-select" id="{{ form.language.id }}" name="{{ form.language.name }}" required aria-label="{{ config["LOCALISATIONS"]["language"]["helptext"][request.language] }}">
{% endif %}
{% if not form.language.data %}
<option value="" disabled selected>{{ config["LOCALISATIONS"]["language"]["choose"][request.language] }}</option>
......@@ -86,7 +86,7 @@
</div>
</form>
<div class="py-5 text-center processing transition-opacity hidden" hidden>
<img id="processing_img" class="mx-auto mb-4 spinner" src="{{ url_for('static', filename='img/arrow-repeat.svg') }}" alt="Checkmark" height="136">
<img id="processing_img" class="mx-auto mb-4 spinner" src="{{ url_for('static', filename='img/arrow-repeat.svg') }}" alt="Spinning arrow" height="136">
<p id="processing_text" class="pt-4 lead">{% autoescape false %}{{config["LOCALISATIONS"]["uploadingtext"][request.language]}}{% endautoescape %}</p>
</div>
</div>
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment