wickes-css2 2.101.0-develop.2 → 2.101.0-develop.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "wickes-css2",
-  "version": "2.101.0-develop.2",
+  "version": "2.101.0-develop.4",
   "description": "CSS and JS and page templates in use by Wickes",
   "main": "index.js",
   "scripts": {

package/src/js/components/general/offer-banner.js

@@ -3,19 +3,13 @@ $(document).ready(function () {
     var offerBanner = $('.offer-banner')[0],
       offer;
 
-    var selectors = [
-      'main > div > div > div:nth-child(1) > div > h1',
-      'main > div.hybris-class > div > h1:nth-child(1)',
-      'main > div.cartMessages',
-      'main div.checkout-header',
-      'main.my-account',
-      'div.new-usp-container',
-      'div.breadcrumbs'
-    ];
+    var stickyWrapper = $('.sticky-wrapper')[0];
 
-    var targetContainers = ['main', 'div.new-usp-container', 'div.breadcrumbs'];
+    if (!offerBanner) {
+      return;
+    }
 
-    Wick.applyTopMarginIfBanner = function () {
+    Wick.applyBottomMarginIfBanner = function () {
       if (!Wick.isTradePro) {
         return;
       }
@@ -25,34 +19,8 @@ $(document).ready(function () {
       }
 
       let bannerHeight = $(offerBanner).outerHeight();
-
-      var containers = new Set();
-      var containersSelector = targetContainers.join(', ');
-
-      selectors.forEach(function (sel) {
-        var elements = $(sel);
-        if (!elements.length) return;
-
-        elements.each(function () {
-          var container = $(this).closest(containersSelector);
-          if (container.length) {
-            containers.add(container[0]);
-          }
-        });
-      });
-
-      var hasBreadcrumbs = Array.from(containers).some(el => $(el).is('div.breadcrumbs'));
-
-      if (hasBreadcrumbs) {
-        containers = new Set(
-          Array.from(containers).filter(el => $(el).is('div.breadcrumbs'))
-        );
-      }
-
-      containers.forEach(function (el) {
-        $(el).css('margin-top', bannerHeight + 'px');
-      });
-    }
+      $(stickyWrapper).css('margin-bottom', bannerHeight + 'px');
+    };
 
     var init = function () {
       offer = new Waypoint.Sticky({
@@ -77,6 +45,8 @@ $(document).ready(function () {
       if (elHeight !== offer.$wrapper.outerHeight(true)) {
         offer.$wrapper.height(elHeight);
       }
+
+      Wick.applyBottomMarginIfBanner();
     }
 
     var bindEvents = function () {
@@ -85,10 +55,6 @@ $(document).ready(function () {
       $(document).on('mobileNav.toggle', toggle);
     };
 
-    if (!offerBanner) {
-      return;
-    }
-
     // Workaround for sticky banner functionality in IE
     function isIE() {
       var ua = navigator.userAgent;
@@ -101,7 +67,7 @@ $(document).ready(function () {
       bindEvents();
     }
 
-    Wick.applyTopMarginIfBanner();
+    Wick.applyBottomMarginIfBanner();
 
     return offer;
   })();

package/src/scss/common/_common.scss

@@ -331,8 +331,13 @@ main {
 }
 
 @keyframes spin {
-  0% { transform: rotate(0deg); }
-  100% { transform: rotate(360deg); }
+  0% {
+    transform: rotate(0deg);
+  }
+
+  100% {
+    transform: rotate(360deg);
+  }
 }
 
 @include media-breakpoint-down(md) {
@@ -389,7 +394,7 @@ main {
   .product-code {
     @include additional-text;
 
-    &__empty  {
+    &__empty {
       display: none;
     }
   }

package/src/scss/components/_order-summary.scss

@@ -373,87 +373,3 @@ $ios-notch-offset: 80px !default;
     }
   }
 }
-
-@include media-breakpoint-down(md) {
-  .tp-app {
-    &.tp-android,
-    &.tp-ios:not(.tp-ios-notch) {
-      .summary--mobile {
-        .summary__mobile-bar,
-        .summary__aside {
-          bottom: $android-offset !important;
-        }
-      }
-
-      .summary__aside.collapse.show {
-        bottom: 177px + $android-offset !important;
-      }
-
-      .summary__aside.collapsing {
-        bottom: 177px + $android-offset !important;
-      }
-
-      .summary__aside.collapse.show.single-button,
-      .summary__aside.collapsing.single-button {
-        bottom: 125px + $android-offset !important;
-      }
-    }
-
-    &.tp-ios-notch {
-      .summary--mobile {
-        .summary__mobile-bar,
-        .summary__aside {
-          bottom: $ios-notch-offset !important;
-        }
-      }
-
-      .summary__aside.collapse.show {
-        bottom: 177px + $ios-notch-offset !important;
-      }
-
-      .summary__aside.collapsing {
-        bottom: 177px + $ios-notch-offset !important;
-      }
-
-      .summary__aside.collapse.show.single-button,
-      .summary__aside.collapsing.single-button {
-        bottom: 125px + $ios-notch-offset !important;
-      }
-    }
-  }
-}
-
-@include media-breakpoint-up(sm) {
-  .tp-app {
-    &.tp-android,
-    &.tp-ios:not(.tp-ios-notch) {
-      .summary__aside.collapse.show {
-        bottom: 182px + $android-offset !important;
-      }
-
-      .summary__aside.collapsing {
-        bottom: 182px + $android-offset !important;
-      }
-
-      .summary__aside.collapse.show.single-button,
-      .summary__aside.collapsing.single-button {
-        bottom: 130px + $android-offset !important;
-      }
-    }
-
-    &.tp-ios-notch {
-      .summary__aside.collapse.show {
-        bottom: 182px + $ios-notch-offset !important;
-      }
-
-      .summary__aside.collapsing {
-        bottom: 182px + $ios-notch-offset !important;
-      }
-
-      .summary__aside.collapse.show.single-button,
-      .summary__aside.collapsing.single-button {
-        bottom: 130px + $ios-notch-offset !important;
-      }
-    }
-  }
-}