Automatic discount cart position fix (#1166)

Shopify · Jan 12, 2022 · 551a3e9 · 551a3e9
1 parent ce9a0ce
commit 551a3e9
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 3 deletions.
diff --git a/assets/component-discounts.css b/assets/component-discounts.css
@@ -12,8 +12,14 @@
   color: rgba(var(--color-button), var(--alpha-button-background));
 }
 
-.discounts__discount--end {
-  justify-content: flex-end;
+.discounts__discount--position {
+  justify-content: center;
+}
+
+@media screen and (min-width: 750px) {
+  .discounts__discount--position {
+    justify-content: flex-end;
+  }
 }
 
 .discounts__discount > .icon {

diff --git a/sections/main-cart-footer.liquid b/sections/main-cart-footer.liquid
@@ -29,7 +29,7 @@
                   {%- if cart.cart_level_discount_applications.size > 0 -%}
                     <ul class="discounts list-unstyled" role="list" aria-label="{{ 'customer.order.discount' | t }}">
                       {%- for discount in cart.cart_level_discount_applications -%}
-                        <li class="discounts__discount discounts__discount--end">
+                        <li class="discounts__discount discounts__discount--position">
                           {%- render 'icon-discount' -%}
                           {{ discount.title }}
                           (-{{ discount.total_allocated_amount | money }})