wickes-css2 2.109.0-develop.6 → 2.109.0-develop.8

package/src/scss/pages/page_store-locator.scss

@@ -7,16 +7,26 @@ h1 {
 
 .cards-store {
   &-list {
-    @include make-col-ready;
-    margin-bottom: 20px;
+    padding-right: 0;
+    padding-left: 0;
+    height: auto;
 
     &__actions {
-      margin: 0 auto;
+      margin: 24px auto 0;
     }
   }
 
   &-wrapper {
     padding-top: 40px;
+
+    .row {
+      display: grid;
+      grid-template-columns: 1fr;
+      gap: 16px;
+      margin-right: 0;
+      margin-left: 0;
+      align-items: start;
+    }
   }
 }
 
@@ -40,10 +50,6 @@ h1 {
   padding-top: 20px;
 }
 
-.cards-store-list__actions {
-  margin: 0 auto;
-}
-
 .btn_store-near-me {
   @include button-full;
   margin-bottom: 20px;
@@ -52,25 +58,20 @@ h1 {
 @include media-breakpoint-down(sm) {
   .cards-store {
     &-list {
-      @include make-col-ready;
-      @include make-col(12);
-
       &__actions {
-        @include make-col-ready;
-        @include make-col(12);
+        width: 100%;
 
         .icon__eye {
-          svg {
-            vertical-align: -.45em;
-            height: 1.375rem;
-            width: 1.3125rem;
+          svg,
+          i {
+            vertical-align: -0.15em;
             margin-right: 5px;
           }
         }
       }
     }
 
-    &-list_open .cards-store-list:not(:nth-child(-n+3)) {
+    &-list_open .cards-store-list:not(:nth-child(-n + 3)) {
       display: block;
     }
   }
@@ -92,18 +93,28 @@ h1 {
   }
 }
 
-@include media-breakpoint-up(md) {
+@include media-breakpoint-up(sm) {
   .cards-store {
-    &-list {
-      @include make-col-ready;
-      @include make-col(4);
+    &-wrapper {
+      .row {
+        grid-template-columns: repeat(2, 1fr);
+      }
+    }
 
-      &__actions {
-        display: none;
+    &-list__actions {
+      margin: 24px 0 0;
+      display: flex;
+      justify-content: center;
+
+      .btn {
+        min-width: 148px;
+        width: auto;
       }
     }
   }
+}
 
+@include media-breakpoint-up(md) {
   .btn_store-near-me {
     display: none;
   }
@@ -111,9 +122,20 @@ h1 {
 
 @include media-breakpoint-up(lg) {
   .cards-store {
-    &-list {
-      @include make-col-ready;
-      @include make-col(3);
+    &-wrapper {
+      .row {
+        grid-template-columns: repeat(3, 1fr);
+      }
+    }
+  }
+}
+
+@include media-breakpoint-up(xl) {
+  .cards-store {
+    &-wrapper {
+      .row {
+        grid-template-columns: repeat(4, 1fr);
+      }
     }
   }
 }

package/src/scss/store-locator-main.scss

@@ -21,9 +21,20 @@
 @import 'components/special-opening-schedule-v2';
 @import 'pages/page_store-locator';
 @import 'pages/page_store-locator-details';
-@import 'components/pagination';
+@import 'components/loader';
+// Loader
+
+.loader-wrapper {
+  position: fixed;
+}
+
+// Main
+main {
+  padding-bottom: 72px;
+}
 
 //Component card extract start
+
 .card {
   flex-direction: row;
   margin-bottom: 30px;
@@ -74,10 +85,12 @@
   div {
     font-weight: 100;
   }
+
   @include media-breakpoint-down(sm) {
     width: 100%;
   }
 }
+
 //Component card extract end
 
 //Page store-locator extract start
@@ -89,4 +102,5 @@
     display: none;
   }
 }
+
 //Page store-locator extract end

package/src/sitemap.html

@@ -50,6 +50,7 @@
                         <li><span class="page-id">1.19</span><a href="page_homepage-with-chat-bot.html" target="_blank">Homepage - With Chat Bot Icon</a></li>
                         <li><span class="page-id">1.20</span><a href="page_plp-with-paint.html" target="_blank">Products list - With paint swatches</a></li>
                         <li><span class="page-id">1.21</span><a href="page_homepage-with-global-search-v2-vat.html" target="_blank">Homepage - With Content Search V2 VAT</a></li>
+                        <li><span class="page-id">1.22</span><a href="page_plp_bloomreach.html" target="_blank">Products list Bloomreach</a></li>
                     </ul>
                     <h3>PDP</h3>
                     <ul>

package/src/js/emulation/store-locator-list.js

@@ -1,19 +0,0 @@
-//TODO: needs refactoring in future, gather tother with range-type.js for common script
-var Wick = Wick || {};
-
-Wick.StoreLocator = (function () {
-  var $button = $('.store-locator__load-button'),
-    cardsListOpenClass = 'cards-store-list_open',
-    $cardsList = $('.cards-store-wrapper'),
-    $buttons = $cardsList.find($button);
-
-  $buttons.on('click', function () {
-    if ($cardsList.hasClass(cardsListOpenClass)) {
-      $('html, body').scrollTop($cardsList.parents('.cards-store-holder').offset().top + 20);
-    }
-    $cardsList.toggleClass(cardsListOpenClass);
-    $buttons.toggle();
-  });
-})();
-
-