wickes-css2 2.109.0-develop.1 → 2.109.0-develop.3

package/build/js/wickes-dc.js

@@ -0,0 +1 @@
+!function a(i,n,s){function o(t,e){if(!n[t]){if(!i[t]){var r="function"==typeof require&&require;if(!e&&r)return r(t,!0);if(l)return l(t,!0);throw(e=new Error("Cannot find module '"+t+"'")).code="MODULE_NOT_FOUND",e}r=n[t]={exports:{}},i[t][0].call(r.exports,function(e){return o(i[t][1][e]||e)},r,r.exports,a,i,n,s)}return n[t].exports}for(var l="function"==typeof require&&require,e=0;e<s.length;e++)o(s[e]);return o}({1:[function(e,t,r){"use strict";$(document).ready(function(){$(".header-right-wrapp .header-right__item:eq(-2)").after('<li class="header-right__item"><a href="#" class="header-right__link swal-confirm"><span class="btn__text"><i class="fas fa-trash fa-2x"></i></span><span class="header-right__link-title">Empty</span></a></li>'),$(".header-mobileicon a:eq(-1)").after('<a class="trash-button-dc swal-confirm" href="#"><div class="btn btn-primary header-shop-list"><span class="icon"><i class="svg-inline--fa fas fa-trash fa-w-12 fa-lg"></i></span></div></a>'),$("head").append("<script src='https://unpkg.com/sweetalert/dist/sweetalert.min.js'><\/script>"),$("head").append("<style>@media (max-width: 399px) { .trash-button-dc { display: none; } }</style>"),"ontouchstart"in window&&$(".trash-button-dc .btn").removeClass("btn-primary");$(".swal-confirm").click(function(e){e.preventDefault(),swal({title:"Are you sure?",text:"You will remove all the items from the basket, including any vouchers applied.",buttons:!0,dangerMode:!0}).then(function(e){e&&($("body").append('<div class="loader-wrapper loader-wrapper--full-page">    <div class="loader-container">      <div class="loader"></div>      <div class="loader-message">Removing items from your basket</div>    </div>  </div>'),$.post("/cart/clear").fail(function(){swal({title:"Error",text:"Failed to remove items from the basket.",dangerMode:!0}),$(".loader-wrapper").remove()}).done(function(){location.reload()}))})})})},{}]},{},[1]);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "wickes-css2",
-  "version": "2.109.0-develop.1",
+  "version": "2.109.0-develop.3",
   "description": "CSS and JS and page templates in use by Wickes",
   "main": "index.js",
   "scripts": {
@@ -51,14 +51,12 @@
     "gulp-htmlmin": "^5.0.1",
     "gulp-json-concat": "^0.2.0",
     "gulp-json-refs": "^0.1.1",
-    "gulp-livereload": "^3.8.1",
     "gulp-purgecss": "4.0.3",
     "gulp-sass": "^4.0.0",
     "gulp-sass-lint": "^1.4.0",
     "gulp-sitemap": "^5.1.0",
     "gulp-sourcemaps": "^2.6.4",
     "gulp-uglify": "^3.0.2",
-    "gulp-watch": "^5.0.0",
     "handlebars-layouts": "^3.1.4",
     "husky": "8.0.3",
     "lint-staged": "13.2.3",

package/src/components/base/button.hbs

@@ -1,4 +1,4 @@
-<button class="btn btn-primary {{#if full}}btn_full{{/if}} {{#if icon}}btn--icon{{/if}} {{modification}}">
+<button class="btn {{#if full}}btn_full{{/if}} {{#if icon}}btn--icon{{/if}} {{modification}}" type="{{type}}">
   {{#if icon}}
     <i class="{{icon}}"></i>
   {{/if}}

package/src/components/card_product_banner_v2.hbs

@@ -5,6 +5,9 @@
      {{#if required-amount-desktop}}data-required-amount-desktop="{{required-amount-desktop}}"{{/if}}
 >
     <a class="card-product-banner__link" href="{{href}}">
-        <img class="card-product-banner__image" src="{{src}}" alt="banner">
+        <picture class="card-product-banner__picture">
+            <source class="card-product-banner__image" srcset="{{#if mobile-src}}{{mobile-src}}{{else}}{{src}}{{/if}}" media="(max-width: 768px)">
+            <img class="card-product-banner__image" src="{{src}}" alt="banner">
+        </picture>
     </a>
 </div>

package/src/components/card_sponsor_banner.hbs

@@ -3,6 +3,9 @@
   {{#if mobile-position}}data-mobile-position="{{mobile-position}}"{{/if}}
 >
   <a class="card-sponsor-banner__link" href="{{href}}">
-    <img class="card-sponsor-banner__image" src="{{src}}" alt="banner">
+    <picture class="card-sponsor-banner__picture">
+      <source class="card-sponsor-banner__image" srcset="{{#if mobile-src}}{{mobile-src}}{{else}}{{src}}{{/if}}" media="(max-width: 768px)">
+      <img class="card-sponsor-banner__image" src="{{src}}" alt="banner">
+    </picture>
   </a>
 </div>

package/src/components/checkout_order-summary-new.hbs

@@ -1,4 +1,4 @@
-<div class="checkout-widget checkout-widget_order-summary {{#if mod}}checkout-widget-{{mod}}{{/if}}">
+<div class="checkout-widget checkout-widget_order-summary {{#if mod}}checkout-widget-{{mod}}{{/if}}"{{#if hideDeliveryCostMessage}} data-hide-delivery-cost-message="true"{{/if}}>
     {{#unless head}}
         <h3 class="heading-3 checkout-widget__header">Order Summary</h3>
     {{/unless}}
@@ -16,6 +16,15 @@
                     <span>{{title}}</span>
                     <span class="checkout-widget__item-value">{{value}}</span>
                 </li>
+                {{#ifCond (lookup this "mod") "==" "delivery"}}
+                {{#unless ../hideDeliveryCostMessage}}
+                <li class="checkout-widget__item checkout-widget__item-delivery-cost-message">
+                    <span class="checkout-widget__item-value" id="order-delivery-cost-message">
+                        Final delivery cost confirmed at checkout
+                    </span>
+                </li>
+                {{/unless}}
+                {{/ifCond}}
             {{/each}}
         {{/if}}
         {{#unless hideApplyVoucher}}

package/src/components/click-and-collect-modal.hbs

@@ -10,20 +10,6 @@
                     <div class="click-and-collect__locator">
                         <form action="#" class="click-and-collect__locator-form">
 
-                            <!--
-                            <div class="form-row" data-row-required>
-                                <div class="click-and-collect__locator-town form-row__field">
-                                    <input class="tbx" placeholder="Enter a town/city or postcode"
-                                           id="click-and-collect-town" type="text"
-                                           aria-label="Enter a town/city or postcode">
-                                </div>
-                                <div class="click-and-collect__locator-btn">
-                                    <button class="btn btn_full btn-primary" id="click-and-collect-submit">
-                                        <span class="btn__text">Find store</span>
-                                    </button>
-                                </div>
-                            </div>-->
-
                             <div class="form-row" data-row-required>
                                 <div class="click-and-collect__locator-town form-row__field">
                                         <div class="input-group">

package/src/components/date-selection.hbs

@@ -69,7 +69,7 @@
               <i class="fas fa-shipping-fast icon"></i>
             </span>
           <p class="description">
-            Select todays’ day on the calendar to get Wickes Rapid delivery
+            Select todays’ day on the calendar to get Rapid delivery.
           </p>
         </div>
           {{> delivery-types

package/src/components/delivery-types.hbs

@@ -3,9 +3,17 @@
     <button class="btn btn_full delivery-btn">
       {{#if title}}
         <span class="delivery-btn__content">
-              <span class="title">{{title}}</span>
-              <span class="subtitle">{{subtitle}}</span>
-            </span>
+          <span class="title">{{title}}</span>
+          <span class="subtitle">
+            {{subtitle}}
+            {{> info-icon
+                modification="rapid-info-icon d-none"
+                title="This is an estimated time provided by our third party courier and is subject to change"
+                data-placement="bottom"
+                data-container="body"
+            }}
+          </span>
+        </span>
         {{#if classImg}}
           <span class="delivery-btn__image">
             <i class="{{classImg}}"></i>

package/src/components/injected-content.hbs

@@ -2,7 +2,12 @@
     {{#each srp_injected_content.items}}
         {{#if banner}}
             <div class="srp-injected__image">
-                {{{banner.htmlText}}}
+                <a class="srp-injected__link" href="{{banner.href}}">
+                    <picture class="srp-injected__picture">
+                        <source class="srp-injected__img" srcset="{{#if banner.mobile-src}}{{banner.mobile-src}}{{else}}{{banner.src}}{{/if}}" media="(max-width: 768px)">
+                        <img class="srp-injected__img" src="{{banner.src}}" alt="{{banner.alt}}">
+                    </picture>
+                </a>
             </div>
         {{else}}
             <div class="srp-injected__content">

package/src/components/modal.hbs

@@ -1,6 +1,6 @@
 <!-- Bootstrap 4 modal dialog markup https://getbootstrap.com/docs/4.1/components/modal/ -->
 
-<div class="modal  modal-box {{#if fullWidth}}modal-box_full{{/if}} {{#if wide}}modal-box_wide{{/if}}{{classMod}}"
+<div class="modal  modal-box {{#if fullWidth}}modal-box_full{{/if}} {{#if wide}}modal-box_wide{{/if}} {{classMod}}"
      id="{{id}}" role="dialog" tabindex="-1" data-backdrop="{{backdrop}}" data-keyboard={{#if keyboard}}{{keyboard}}{{else}}false{{/if}}
 >
   <div class="modal-dialog modal-box__container {{#if centered}}modal-dialog-centered{{/if}}" role="document">

package/src/components/modals/notify-me-modal.hbs

@@ -0,0 +1,76 @@
+{{#extend "modal"
+          id="modal-notify-me"
+          fullWidth=false
+          wide=true
+          backdrop=true
+          title=""
+          showCloseBtn=true
+          classMod=mod
+}}
+  {{#content "header"}}
+    <div class="notify-me__header">
+      <h3 class="modal-title modal-box__title"
+          data-notify-header="form">
+        <span class="icon-wrap">
+          <i class="fas fa-bell icon"></i>
+        </span>
+        Notify me when this product is back in stock
+      </h3>
+
+      <h3 class="modal-title modal-box__title d-none"
+          data-notify-header="success">
+        <i class="fas fa-check-circle text-success icon"></i>
+        You will receive an email when the product is back in stock
+      </h3>
+    </div>
+  {{/content}}
+
+  {{#content "sections"}}
+    {{#extend "modal-body-section"}}
+      {{#content "body"}}
+        <div class="notify-me" data-notify-root>
+          <div class="notify-me__state notify-me__state--form" data-notify-state="form">
+            <form class="notify-me-form" novalidate>
+              {{> form-row type="email" id="notify-me-email" name="email" label="Email address" value="test@test.com" required="true"}}
+
+              <p class="notify-me-form__note">
+                By providing your email address, you agree to receive email notifications until your product is back in
+                stock.
+                Your email will not be stored for any other purpose.
+              </p>
+
+              <div class="notify-me-form__ctas">
+                {{> base/button
+                text="Notify me"
+                modification="btn-primary btn--notify-submit"
+                type="submit"
+                }}
+                <button class="btn btn-outline-primary btn--notify-cancel" type="button" data-dismiss="modal">
+                  Cancel
+                </button>
+              </div>
+            </form>
+          </div>
+
+          <div class="notify-me__state notify-me__state--success d-none" data-notify-state="success">
+            <div class="notify-me__success">
+              <div class="notify-me-result">
+                <img
+                  src="./img/tile-buying-guide.jpg"
+                  alt="Wickes General Purpose Claw Hammer - 16oz"
+                  class="notify-me-result__img">
+                <p class="notify-me-result__title">
+                  Wickes General Purpose Claw Hammer - 16oz
+                </p>
+              </div>
+
+              <button class="btn btn-outline-primary btn--notify-close" type="button" data-dismiss="modal">
+                Close
+              </button>
+            </div>
+          </div>
+        </div>
+      {{/content}}
+    {{/extend}}
+  {{/content}}
+{{/extend}}

package/src/components/order-summary.hbs

@@ -3,7 +3,7 @@
   {{> summary-mobile-bar}}
   <div class="collapse summary__aside container" id="checkout-summary-mobile-accordion-{{id}}" data-sticky-element>
 
-    {{> checkout_order-summary-new head=title mod=mod id=(concat id "-mobile") mobile="true"}}
+    {{> checkout_order-summary-new head=title mod=mod id=(concat id "-mobile") mobile="true" hideDeliveryCostMessage=hideDeliveryCostMessage}}
     {{#unless (or basket checkout)}}
       <div class="summary__payment footer-checkout">
         {{#unless merged}}
@@ -47,7 +47,7 @@
     </div>
   {{/if}}
   <div class="summary__aside">
-    {{> checkout_order-summary-new head=title mod=mod id=id switch-vat=switch-vat}}
+    {{> checkout_order-summary-new head=title mod=mod id=id switch-vat=switch-vat hideDeliveryCostMessage=hideDeliveryCostMessage}}
 
     {{#if klarna-placement}}
       <div class="summary__klarna">