[a11y] Improved form error messages, descriptive labels, focusable toggle-link (#2002)

This commit is contained in:
Richard Schreiber
2021-03-19 16:13:25 +01:00
committed by GitHub
parent 954fece6cf
commit 11f23c3fd2
6 changed files with 57 additions and 13 deletions

View File

@@ -57,7 +57,7 @@
<div class="panel-heading">
{% if payment_provider.identifier != "free" %}
<div class="pull-right flip">
<a href="{% eventurl request.event "presale:event.checkout" step="payment" cart_namespace=cart_namespace|default_if_none:"" %}">
<a href="{% eventurl request.event "presale:event.checkout" step="payment" cart_namespace=cart_namespace|default_if_none:"" %}" aria-label="{% trans "Modify payment" %}">
<span class="fa fa-edit" aria-hidden="true"></span>
{% trans "Modify" %}
</a>
@@ -79,7 +79,7 @@
<div class="panel panel-primary panel-contact">
<div class="panel-heading">
<div class="pull-right flip">
<a href="{% eventurl request.event "presale:event.checkout" step="questions" cart_namespace=cart_namespace|default_if_none:"" %}?invoice=1">
<a href="{% eventurl request.event "presale:event.checkout" step="questions" cart_namespace=cart_namespace|default_if_none:"" %}?invoice=1" aria-label="{% trans "Modify invoice information" %}">
<span class="fa fa-edit" aria-hidden="true"></span>
{% trans "Modify" %}
</a>
@@ -129,7 +129,7 @@
<div class="panel panel-primary panel-contact">
<div class="panel-heading">
<div class="pull-right flip">
<a href="{% eventurl request.event "presale:event.checkout" step="questions" cart_namespace=cart_namespace|default_if_none:"" %}">
<a href="{% eventurl request.event "presale:event.checkout" step="questions" cart_namespace=cart_namespace|default_if_none:"" %}" aria-label="{% trans "Modify contact information" %}">
<span class="fa fa-edit" aria-hidden="true"></span>
{% trans "Modify" %}
</a>

View File

@@ -21,9 +21,9 @@
</summary>
<div id="contact">
<div class="panel-body">
{% bootstrap_form contact_form layout="horizontal" %}
{% bootstrap_form contact_form layout="checkout" %}
{% if not invoice_address_asked and event.settings.invoice_name_required %}
{% bootstrap_form invoice_form layout="horizontal" %}
{% bootstrap_form invoice_form layout="checkout" %}
{% endif %}
</div>
</div>
@@ -46,7 +46,7 @@
{{ event.settings.invoice_address_explanation_text|rich_text }}
</div>
{% endif %}
{% bootstrap_form invoice_form layout="horizontal" %}
{% bootstrap_form invoice_form layout="checkout" %}
</div>
</div>
</details>

View File

@@ -140,6 +140,7 @@
{% elif line.addon_to %}
<div class="count">&nbsp;</div>
<div class="singleprice price">
<span class="sr-only">{% trans "price per item" %}</span>
{% if event.settings.display_net_prices %}
{{ line.net_price|money:event.currency }}
{% else %}
@@ -163,6 +164,7 @@
</button>
</form>
{% endif %}
<span class="sr-only">{% trans "quantity" %}</span>
{{ line.count }}
{% if editable %}
<form action="{% eventurl event "presale:event.cart.add" cart_namespace=cart_namespace|default_if_none:"" %}"
@@ -189,6 +191,7 @@
{% endif %}
</div>
<div class="singleprice price">
<span class="sr-only">{% trans "price per item" %}</span>
{% if event.settings.display_net_prices %}
{{ line.net_price|money:event.currency }}
{% else %}
@@ -197,6 +200,7 @@
</div>
{% endif %}
<div class="totalprice price">
<span class="sr-only">{% trans "price" %}</span>
{% if event.settings.display_net_prices %}
<strong>{{ line.net_total|money:event.currency }}</strong>
{% if line.tax_rate and line.total %}

View File

@@ -186,7 +186,7 @@
<div class="panel-heading">
{% if order.can_modify_answers %}
<div class="pull-right flip">
<a href="{% eventurl event "presale:event.order.modify" secret=order.secret order=order.code %}">
<a href="{% eventurl event "presale:event.order.modify" secret=order.secret order=order.code %}" aria-label="{% trans "Change ordered items" %}">
<span class="fa fa-edit" aria-hidden="true"></span>
{% trans "Change details" %}
</a>
@@ -280,7 +280,7 @@
{% if invoice_address_asked or request.event.settings.invoice_name_required %}
{% if order.can_modify_answers %}
<div class="pull-right flip">
<a href="{% eventurl event "presale:event.order.modify" secret=order.secret order=order.code %}">
<a href="{% eventurl event "presale:event.order.modify" secret=order.secret order=order.code %}" aria-label="{% trans "Change your information" %}">
<span class="fa fa-edit" aria-hidden="true"></span>
{% trans "Change details" %}
</a>