wickes-css2 2.94.0-develop.2 → 2.94.0-develop.20

package/src/scss/components/_checkout-action.scss

@@ -1,16 +1,45 @@
 @import '../helpers/helpers';
 
 .checkout-action {
-  margin-top: 5px;
-  padding-bottom: 20px;
-  border-bottom: 1px solid $gray;
+  padding: 15px 15px 24px;
+
+  .btn-checkout {
+    .checkout-text--mixed {
+      display: none;
+    }
+
+    .checkout-text--collect {
+      display: inline;
+    }
+  }
+
+  &:not(:has(.checkout-widget__basket-block)) {
+    .btn-checkout {
+      .checkout-text--mixed {
+        display: inline;
+      }
+
+      .checkout-text--collect {
+        display: none;
+      }
+    }
+  }
+
+  &:not(:has(.checkout-widget__basket-block)) {
+    .btn-checkout {
+      margin-bottom: 0;
+    }
+  }
 
   & .btn-checkout {
     display: flex;
     justify-content: center;
     align-items: center;
-    height: 40px;
-    margin-bottom: 20px;
+    height: 42px;
+    margin-bottom: 10px;
+    font-weight: 500;
+    font-size: 16px;
+    line-height: 1.5rem;
 
     .icon {
       padding-left: 5px;
@@ -27,18 +56,21 @@
 
       & .paypal-button {
         padding-top: 0;
+        height: 42px;
       }
 
       & .paypal-button-text {
         padding-left: 3px;
-        font-size: .875rem;
+        font-size: 1rem;
         font-weight: 500;
+        line-height: 1rem;
       }
     }
   }
 
   &__wrapper {
     order: -2;
+    background-color: $white;
 
     &.large {
       order: inherit;
@@ -51,6 +83,30 @@
     &.mounted {
       display: none;
     }
+
+    &.mobile {
+      display: block;
+      position: static;
+      order: 1;
+
+      .checkout-action {
+        margin-top: 20px;
+        padding: 0;
+        padding-bottom: 20px;
+
+        .btn-checkout {
+          margin-bottom: 20px;
+        }
+
+        &:not(:has(.checkout-widget__basket-block)) {
+          padding-bottom: 0;
+
+          .btn-checkout {
+            margin-bottom: 0;
+          }
+        }
+      }
+    }
   }
 
   &__large {
@@ -93,6 +149,66 @@
   }
 }
 
+@include media-breakpoint-up(sm) {
+
+  .checkout-action {
+    margin-top: 0;
+    padding: 0;
+    border-bottom: 0;
+
+    &__wrapper {
+      padding: 20px 0 24px;
+      background-color: $white;
+      order: -2;
+
+      &.large {
+        order: inherit;
+
+        .checkout-action {
+          margin-top: 20px;
+        }
+      }
+
+      &.mounted {
+        display: none;
+      }
+
+      &.mobile {
+        display: block;
+        position: static;
+        order: 1;
+        padding: 0;
+
+        .checkout-action {
+          margin-top: 20px;
+          padding: 0;
+          padding-bottom: 20px;
+
+          .btn-checkout {
+            margin-bottom: 20px;
+          }
+
+          &:not(:has(.checkout-widget__basket-block)) {
+            padding-bottom: 0;
+
+            .btn-checkout {
+              margin-bottom: 0;
+            }
+          }
+        }
+      }
+    }
+  }
+
+  .checkout-action .btn-checkout {
+    margin-bottom: 10px;
+  }
+
+  .checkout-action--single .btn-checkout {
+    margin-bottom: 0;
+  }
+}
+
 @include media-breakpoint-up(md) {
   .checkout-action {
     .pay-pal_wrap {
@@ -105,8 +221,13 @@
 
 @include media-breakpoint-up(lg) {
   .checkout-action {
+    margin-top: 5px;
+    padding-bottom: 20px;
+    border-bottom: 1px solid $gray;
+
     &__wrapper {
       order: inherit;
+      position: static;
 
       &.large {
         order: -2;
@@ -115,6 +236,7 @@
 
       &.mounted {
         display: block;
+        padding: 0;
         padding-top: 15px;
         background: $white;
 
@@ -122,6 +244,10 @@
           border-bottom: 0;
         }
       }
+
+      &.mobile {
+        display: none;
+      }
     }
 
     &__large {

package/src/scss/components/_order-item-cc.scss

@@ -98,12 +98,6 @@
     }
   }
 
-  & .store {
-    &__act {
-      display: none;
-    }
-  }
-
   &__store-info {
     @include make-col(12);
     margin-top: 15px;