[Timber] update cart a11y qty input and button

locales/de.json

@@ -65,7 +65,9 @@
       "empty": "Ihr Einkaufswagen ist im Moment leer.",
       "continue_browsing_html": "Mit der Suche <a href=\"/collections/all\">hier</a> fortfahren.",
       "close_cart": "Einkaufswagen schließen",
-      "savings_html": "Sie sparen  {{ price }}"
+      "savings_html": "Sie sparen  {{ price }}",
+      "reduce_quantity": "Artikelmenge um eins reduzieren",
+      "increase_quantity": "Artikelmenge um eins erhöhen"
     },
     "label": {
       "product": "Artikel",

locales/en.default.json

@@ -65,7 +65,9 @@
       "empty": "Your cart is currently empty.",
       "continue_browsing_html": "Continue browsing <a href=\"/collections/all\">here</a>.",
       "close_cart": "Close Cart",
-      "savings_html": "You're saving {{ price }}"
+      "savings_html": "You're saving {{ price }}",
+      "reduce_quantity": "Reduce item quantity by one",
+      "increase_quantity": "Increase item quantity by one"
     },
     "label": {
       "product": "Product",

locales/es.json

@@ -65,7 +65,9 @@
       "empty": "Su carrito actualmente está vacío.",
       "continue_browsing_html": "Continúe explorando <a href=\"/collections/all\">aquí</a>.",
       "close_cart": "Cerrar carrito",
-      "savings_html": "Está ahorrando {{ price }}"
+      "savings_html": "Está ahorrando {{ price }}",
+      "reduce_quantity": "Quitar uno a la cantidad de artículos",
+      "increase_quantity": "Aumentar uno a la cantidad de artículos"
     },
     "label": {
       "product": "Producto",

locales/fr.json

@@ -65,7 +65,9 @@
       "empty": "Votre panier est vide.",
       "continue_browsing_html": "<a href=\"/collections/all\">Retourner au magasinage</a>.",
       "close_cart": "Fermer le panier",
-      "savings_html": "Vous économisez {{ price }}"
+      "savings_html": "Vous économisez {{ price }}",
+      "reduce_quantity": "Réduire la quantité de l'article de un",
+      "increase_quantity": "Augmenter la quantité de l'article de un"
     },
     "label": {
       "product": "Produit",

locales/pt-BR.json

@@ -65,7 +65,9 @@
       "empty": "Seu carrinho está vazio no momento.",
       "continue_browsing_html": "Continue navegando <a href=\"/collections/all\">aqui</a>.",
       "close_cart": "Fechar carrinho",
-      "savings_html": "Você está economizando {{ price }}"
+      "savings_html": "Você está economizando {{ price }}",
+      "reduce_quantity": "Reduzir quantidade em uma unidade",
+      "increase_quantity": "Aumentar quantidade em uma unidade"
     },
     "label": {
       "product": "Produto",

locales/pt-PT.json

@@ -65,7 +65,9 @@
       "empty": "O seu carrinho de compras está neste momento vazio.",
       "continue_browsing_html": "Continue a ver <a href=\"/collections/all\">aqui</a>.",
       "close_cart": "Fechar Carrinho de Compras",
-      "savings_html": "Está a poupar {{ price }}"
+      "savings_html": "Está a poupar {{ price }}",
+      "reduce_quantity": "Reduza a quantidade do artigo em um",
+      "increase_quantity": "Aumente a quantidade do artigo em um"
     },
     "label": {
       "product": "Produto",

snippets/ajax-cart-template.liquid

@@ -40,12 +40,14 @@
                     <div class="ajaxcart__qty">
                       <button type="button" class="ajaxcart__qty-adjust ajaxcart__qty--minus icon-fallback-text" data-id="{{id}}" data-qty="{{itemMinus}}" data-line="{{line}}">
                         <span class="icon icon-minus" aria-hidden="true"></span>
-                        <span class="fallback-text">&minus;</span>
+                        <span class="fallback-text" aria-hidden="true">&minus;</span>
+                        <span class="visually-hidden">{% endraw %}{{ 'cart.general.reduce_quantity' | t }}{% raw %}</span>
                       </button>
                       <input type="text" name="updates[]" class="ajaxcart__qty-num" value="{{itemQty}}" min="0" data-id="{{id}}" data-line="{{line}}" aria-label="quantity" pattern="[0-9]*">
                       <button type="button" class="ajaxcart__qty-adjust ajaxcart__qty--plus icon-fallback-text" data-id="{{id}}" data-line="{{line}}" data-qty="{{itemAdd}}">
                         <span class="icon icon-plus" aria-hidden="true"></span>
-                        <span class="fallback-text">+</span>
+                        <span class="fallback-text" aria-hidden="true">+</span>
+                        <span class="visually-hidden">{% endraw %}{{ 'cart.general.increase_quantity' | t }}{% raw %}</span>
                       </button>
                     </div>
                   </div>
@@ -110,12 +112,14 @@
     <div class="ajaxcart__qty">
       <button type="button" class="ajaxcart__qty-adjust ajaxcart__qty--minus icon-fallback-text" data-id="{{id}}" data-qty="{{itemMinus}}">
         <span class="icon icon-minus" aria-hidden="true"></span>
-        <span class="fallback-text">&minus;</span>
+        <span class="fallback-text" aria-hidden="true">&minus;</span>
+        <span class="visually-hidden">{% endraw %}{{ 'cart.general.reduce_quantity' | t }}{% raw %}</span>
       </button>
       <input type="text" class="ajaxcart__qty-num" value="{{itemQty}}" min="0" data-id="{{id}}" aria-label="quantity" pattern="[0-9]*">
       <button type="button" class="ajaxcart__qty-adjust ajaxcart__qty--plus icon-fallback-text" data-id="{{id}}" data-qty="{{itemAdd}}">
         <span class="icon icon-plus" aria-hidden="true"></span>
-        <span class="fallback-text">+</span>
+        <span class="fallback-text" aria-hidden="true">+</span>
+        <span class="visually-hidden">{% endraw %}{{ 'cart.general.increase_quantity' | t }}{% raw %}</span>
       </button>
     </div>
   {% endraw %}
@@ -125,12 +129,14 @@
     <div class="js-qty">
       <button type="button" class="js-qty__adjust js-qty__adjust--minus icon-fallback-text" data-id="{{id}}" data-qty="{{itemMinus}}">
         <span class="icon icon-minus" aria-hidden="true"></span>
-        <span class="fallback-text">&minus;</span>
+        <span class="fallback-text" aria-hidden="true">&minus;</span>
+        <span class="visually-hidden">{% endraw %}{{ 'cart.general.reduce_quantity' | t }}{% raw %}</span>
       </button>
       <input type="text" class="js-qty__num" value="{{itemQty}}" min="1" data-id="{{id}}" aria-label="quantity" pattern="[0-9]*" name="{{inputName}}" id="{{inputId}}">
       <button type="button" class="js-qty__adjust js-qty__adjust--plus icon-fallback-text" data-id="{{id}}" data-qty="{{itemAdd}}">
         <span class="icon icon-plus" aria-hidden="true"></span>
-        <span class="fallback-text">+</span>
+        <span class="fallback-text" aria-hidden="true">+</span>
+        <span class="visually-hidden">{% endraw %}{{ 'cart.general.increase_quantity' | t }}{% raw %}</span>
       </button>
     </div>
   {% endraw %}

templates/cart.liquid

@@ -90,7 +90,7 @@
               </span>
               {% for discount in item.discounts %}
                 <span class="cart-item__discount">{{ discount.title }}</span>
-              {% endfor %}  
+              {% endfor %}
             </td>
           </tr>
         {% endfor %}
@@ -111,12 +111,12 @@
         {% if cart.total_discounts > 0 %}
           {% assign savings = cart.total_discounts | money %}
           <p>
-            <span class="cart-subtotal__savings"><em>{{ 'cart.general.savings_html' | t: price: savings }}</em></span>  
+            <span class="cart-subtotal__savings"><em>{{ 'cart.general.savings_html' | t: price: savings }}</em></span>
           </p>
-        {% endif %}  
+        {% endif %}
         <p><em>{{ 'cart.general.shipping_at_checkout' | t }}</em></p>
-        <input type="submit" name="update" class="btn--secondary update-cart" value="{{ 'cart.general.update' | t }}">
-        <input type="submit" name="checkout" class="btn" value="{{ 'cart.general.checkout' | t }}">
+        <button type="submit" name="update" class="btn--secondary update-cart">{{ 'cart.general.update' | t }}</button>
+        <button type="submit" name="checkout" class="btn">{{ 'cart.general.checkout' | t }}</button>
       </div>
     </div>
   </form>