From da937dc4e3faf3eda2f81c56f4215d67a647dc56 Mon Sep 17 00:00:00 2001
From: Raphael Michel <mail@raphaelmichel.de>
Date: Sun, 17 Oct 2021 18:35:55 +0200
Subject: [PATCH] [a11y] Small fixes and improvements

---
 .../pretixpresale/event/checkout_addons.html  |  2 +-
 .../pretixpresale/event/checkout_confirm.html | 31 +++++++++----------
 .../pretixpresale/event/fragment_cart.html    |  4 +--
 .../static/pretixpresale/scss/_checkout.scss  | 11 +++++++
 .../static/pretixpresale/scss/_event.scss     |  9 ++++--
 .../static/pretixpresale/scss/_forms.scss     |  1 +
 .../static/pretixpresale/scss/main.scss       |  2 ++
 7 files changed, 38 insertions(+), 22 deletions(-)

diff --git a/src/pretix/presale/templates/pretixpresale/event/checkout_addons.html b/src/pretix/presale/templates/pretixpresale/event/checkout_addons.html
index 9c3905384..8826ec6a0 100644
--- a/src/pretix/presale/templates/pretixpresale/event/checkout_addons.html
+++ b/src/pretix/presale/templates/pretixpresale/event/checkout_addons.html
@@ -122,7 +122,7 @@
                                                     </div>
                                                     <div class="col-md-2 col-xs-6 availability-box">
                                                         {% if not event.settings.show_variations_expanded %}
-                                                        <button type="button" data-toggle="variations" class="btn btn-link js-only"
+                                                        <button type="button" data-toggle="variations" class="btn btn-default btn-block js-only"
                                                             data-label-alt="{% trans "Hide variants" %}"
                                                             aria-expanded="false"
                                                             aria-label="{% blocktrans trimmed with item=item.name count=item.available_variations|length %}Show {{count}} variants of {{item}}{% endblocktrans %}">
diff --git a/src/pretix/presale/templates/pretixpresale/event/checkout_confirm.html b/src/pretix/presale/templates/pretixpresale/event/checkout_confirm.html
index 29c8a5549..b52a364fb 100644
--- a/src/pretix/presale/templates/pretixpresale/event/checkout_confirm.html
+++ b/src/pretix/presale/templates/pretixpresale/event/checkout_confirm.html
@@ -13,26 +13,25 @@
             data-asynctask-headline="{% trans "Please hang tight, we're finalizing your order!" %}">
         {% csrf_token %}
         <div class="panel panel-primary cart">
-            <div class="panel-heading">
-                <div class="pull-right flip">
-                    <strong id="cart-deadline-short" data-expires="{{ cart.first_expiry|date:"Y-m-d H:i:sO" }}">
-                        {% if cart.minutes_left > 0 or cart.seconds_left > 0 %}
-                            {{ cart.minutes_left|stringformat:"02d" }}:{{ cart.seconds_left|stringformat:"02d" }}
-                        {% else %}
-                            {% trans "Cart expired" %}
-                        {% endif %}
-                    </strong>
-                    <span class="helper-display-block cart-modify">
-                        <a href="{% eventurl request.event "presale:event.index" cart_namespace=cart_namespace|default_if_none:"" %}">
-                            <span class="fa fa-edit" aria-hidden="true"></span>
-                            {% trans "Add or remove tickets" %}
-                        </a>
-                    </span>
-                </div>
+            <div class="panel-heading panel-heading-flex">
                 <h3 class="panel-title">
                     <i class="fa fa-shopping-cart" aria-hidden="true"></i>
                     {% trans "Your cart" %}
                 </h3>
+                <span class="panel-heading-flex-gap"></span>
+                <strong class="helper-display-block" id="cart-deadline-short" data-expires="{{ cart.first_expiry|date:"Y-m-d H:i:sO" }}">
+                    {% if cart.minutes_left > 0 or cart.seconds_left > 0 %}
+                        {{ cart.minutes_left|stringformat:"02d" }}:{{ cart.seconds_left|stringformat:"02d" }}
+                    {% else %}
+                        {% trans "Cart expired" %}
+                    {% endif %}
+                </strong>
+                <span class="helper-display-block cart-modify">
+                    <a href="{% eventurl request.event "presale:event.index" cart_namespace=cart_namespace|default_if_none:"" %}">
+                        <span class="fa fa-edit" aria-hidden="true"></span>
+                        {% trans "Add or remove tickets" %}
+                    </a>
+                </span>
             </div>
             <div class="panel-body">
                 {% include "pretixpresale/event/fragment_cart.html" with cart=cart event=request.event editable=False %}
diff --git a/src/pretix/presale/templates/pretixpresale/event/fragment_cart.html b/src/pretix/presale/templates/pretixpresale/event/fragment_cart.html
index 0f2824454..2c3dd117c 100644
--- a/src/pretix/presale/templates/pretixpresale/event/fragment_cart.html
+++ b/src/pretix/presale/templates/pretixpresale/event/fragment_cart.html
@@ -115,7 +115,7 @@
                                 </dt>
                                 <dd class="toplevel{% if event.settings.attendee_addresses_asked and not event.settings.attendee_emails_asked %} blank-after{% endif %}">
                                     <span data-toggle="tooltip" title="{% trans "Attendee name" %}">
-                                        {% if line.attendee_name %}{{ line.attendee_name }}{% else %}<em>{% trans "No attendee name provided" %}</em>{% endif %}
+                                        {% if line.attendee_name %}{{ line.attendee_name }}{% else %}<em class="text-muted">{% trans "No attendee name provided" %}</em>{% endif %}
                                     </span>
                                 </dd>
                             {% endif %}
@@ -177,7 +177,7 @@
                                         {{ q.answer|linebreaksbr }}
                                     {% endif %}
                                 {% else %}
-                                    <em>{% trans "not answered" %}</em>
+                                    <em class="text-muted">{% trans "not answered" %}</em>
                                 {% endif %}
                             </dd>
                         {% endfor %}
diff --git a/src/pretix/static/pretixpresale/scss/_checkout.scss b/src/pretix/static/pretixpresale/scss/_checkout.scss
index 53c40a263..9bec3d6fe 100644
--- a/src/pretix/static/pretixpresale/scss/_checkout.scss
+++ b/src/pretix/static/pretixpresale/scss/_checkout.scss
@@ -2,6 +2,7 @@
   display: flex;
   flex-direction: row;
   margin: 15px 0 13px 0;
+  padding: 0;
   list-style: none;
 
   .checkout-step {
@@ -161,3 +162,13 @@
   padding: 15px;
   border: 1px solid $hr-border;
 }
+.panel-heading-flex {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+  gap: 10px;
+
+  .panel-heading-flex-gap {
+    flex: 1;
+  }
+}
\ No newline at end of file
diff --git a/src/pretix/static/pretixpresale/scss/_event.scss b/src/pretix/static/pretixpresale/scss/_event.scss
index 1b91ca6e0..d44f3d4b6 100644
--- a/src/pretix/static/pretixpresale/scss/_event.scss
+++ b/src/pretix/static/pretixpresale/scss/_event.scss
@@ -280,13 +280,16 @@ h2.subevent-head {
 .info-download {
     margin-top: 0;
     margin-bottom: 30px;
+    .download-btn-form + .download-btn-form {
+        margin-left: .5em;
+    }
+    button {
+        margin-top: .5em;
+    }
 }
 .lead + .info-download {
     margin-top: -15px;
 }
-.download-btn-form + .download-btn-form {
-    margin-left: .5em;
-}
 
 .refund-gift-card-code {
     font-size: 24px;
diff --git a/src/pretix/static/pretixpresale/scss/_forms.scss b/src/pretix/static/pretixpresale/scss/_forms.scss
index ef24bde61..123360976 100644
--- a/src/pretix/static/pretixpresale/scss/_forms.scss
+++ b/src/pretix/static/pretixpresale/scss/_forms.scss
@@ -12,6 +12,7 @@ a.btn, button.btn {
 }
 .panel-title label {
   margin-bottom: 0;
+  display: inline;
 }
 
 .form-control + .form-control-feedback {
diff --git a/src/pretix/static/pretixpresale/scss/main.scss b/src/pretix/static/pretixpresale/scss/main.scss
index bef3b0309..82101a8b8 100644
--- a/src/pretix/static/pretixpresale/scss/main.scss
+++ b/src/pretix/static/pretixpresale/scss/main.scss
@@ -60,6 +60,8 @@ footer nav ul {
     display: flex;
     justify-content: center;
     list-style: none;
+    padding: 0;
+    flex-wrap: wrap;
 }
 footer nav li:not(:first-child):before {
     content: "·";