wickes-css2 2.107.0-tech-debt-issues.1 → 2.107.0

package/build/js/page/kitchen/card-carousel.js

@@ -3,30 +3,30 @@ var Wick = Wick || {};
 Wick.PLPCardSwiper = {};
 
 $(document).ready(function () {
-  const SELECTORS = {
-    kitchenCard: '.kitchen-card',
-    swiperContainer: '.swiper-container-main',
-    nextButton: '.kitchen-card__next-btn',
-    prevButton: '.kitchen-card__prev-btn',
-  };
+    const SELECTORS = {
+        kitchenCard: '.kitchen-card',
+        swiperContainer: '.swiper-container-main',
+        nextButton: '.kitchen-card__next-btn',
+        prevButton: '.kitchen-card__prev-btn',
+    };
 
-  $(SELECTORS.kitchenCard).each(function (index, container) {
-    const $container = $(container);
-    const id = $container.data('id');
+    $(SELECTORS.kitchenCard).each(function (index, container) {
+        const $container = $(container);
+        const id = $container.data('id');
 
-    const sliderElement = $container.find(SELECTORS.swiperContainer)[0];
-    const nextButtonElement = $container.find(SELECTORS.nextButton)[0];
-    const prevButtonElement = $container.find(SELECTORS.prevButton)[0];
+        const sliderElement = $container.find(SELECTORS.swiperContainer)[0];
+        const nextButtonElement = $container.find(SELECTORS.nextButton)[0];
+        const prevButtonElement = $container.find(SELECTORS.prevButton)[0];
 
-    const swiper = new Swiper(sliderElement, {
-      speed: 400,
-      navigation: {
-          nextEl: nextButtonElement,
-          prevEl: prevButtonElement,
-      },
-      simulateTouch: false,
-    });
+        const swiper = new Swiper(sliderElement, {
+            speed: 400,
+            navigation: {
+                nextEl: nextButtonElement,
+                prevEl: prevButtonElement,
+            },
+            simulateTouch: false,
+        });
 
-    Wick.PLPCardSwiper[id] = swiper;
-  });
+        Wick.PLPCardSwiper[id] = swiper;
+    });
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "wickes-css2",
-  "version": "2.107.0-tech-debt-issues.1",
+  "version": "2.107.0",
   "description": "CSS and JS and page templates in use by Wickes",
   "main": "index.js",
   "scripts": {

package/src/components/cart-voucher.hbs

@@ -1,5 +1,14 @@
 <li>
-  {{{text}}}
+  {{#ifCond switch-vat '&&' textExcVat}}
+    <span class="including-vat">
+      {{{text}}}
+    </span>
+    <span class="excluding-vat d-none">
+      {{{textExcVat}}}
+    </span>
+  {{else}}
+    {{{text}}}
+  {{/ifCond}}
   {{#if isDeletable}}
     <span class="icon checkout-widget__voucher-remove">
       <span class="fas fa-times"></span>

package/src/components/checkout-payment-details-v2.hbs

@@ -25,7 +25,7 @@
                       type="radio"
                       id="checkout-payment-details-apple"
                       name="payment-method"
-                      value="apple-pay">
+                      value="apple">
                   <ins></ins>
                   <div class="apple-logo">
                     <img src="img/apple-pay.svg" alt="apple pay">
@@ -44,7 +44,7 @@
                       type="radio"
                       id="checkout-payment-details-google"
                       name="payment-method"
-                      value="google-pay">
+                      value="google">
                   <ins></ins>
                   <div class="google-logo">
                     <img src="img/google-pay-mark.svg" alt="google pay">
@@ -134,7 +134,7 @@
         </div>
       </div>
 
-      <div data-apple-pay class="form-row form-row__action form-row__save apple-wrap" style="display: none;">
+      <div data-apple class="form-row form-row__action form-row__save apple-wrap" style="display: none;">
         <div class="form-row__col-btn">
           <apple-pay-button class="apple__button" buttonstyle="black" type="pay" locale="en-GB"></apple-pay-button>
         </div>
@@ -146,7 +146,7 @@
         </div>
       </div>
 
-      <div data-google-pay class="form-row form-row__action form-row__save google-wrap" style="display: none;">
+      <div data-google class="form-row form-row__action form-row__save google-wrap" style="display: none;">
         <div class="form-row__col-btn">
           <div class="google__button" id="google-pay-btn">
             <button type="button" aria-label="Pay with GPay" class="gpay-button black pay en"></button>

package/src/components/checkout-payment-info-block.hbs

@@ -1,5 +1,5 @@
 <div {{#if dataAttr}}{{dataAttr}}{{/if}} class="{{blockClass}}" style="display: none;">
-  <div class="{{infoClass}}" style="display: none;">
+  <div class="{{infoClass}}">
     <div class="{{infoClass}}__header">
       <h4 class="{{infoClass}}__header_title">{{{heading}}}</h4>
       <div class="{{infoClass}}__logo-img-big">

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

@@ -34,7 +34,7 @@
               </span>
               <ul class="checkout-widget__details-hidden collapse" id="acheckout-widget-accordion-{{id}}">
                   {{#each discounts}}
-                      {{> cart-voucher}}
+                      {{> cart-voucher switch-vat=../switch-vat}}
                   {{/each}}
               </ul>
               <span class="checkout-widget__detail-value">£0.00</span>

package/src/components/gift-cards.hbs

@@ -1,13 +1,20 @@
 <div class="form-row giftcard-row">
   <div class="giftcard">
     <div class="giftcard__wrapper">
-      <span class="giftcard-add" id="giftcard-toggle" role="button" tabindex="0">
-  <span class="giftcard-add__icon-wrap" aria-hidden="true">
-    <i class="fas fa-plus giftcard-add__icon" aria-hidden="true"></i>
-  </span>
-  <span class="giftcard-add__text">Add Wickes Gift Card</span>
-</span>
-      <span class="giftcard-hint">Available with Credit/Debit card only</span>
+      <span
+          class="giftcard-add"
+          id="giftcard-toggle"
+          role="button"
+          tabindex="0"
+          aria-controls="giftcard-inline"
+          aria-expanded="false"
+      >
+        <span class="icon">
+          <i class="fas fa-plus giftcard-add__icon" aria-hidden="true"></i>
+        </span>
+        <span class="giftcard-add__text">Add Wickes Gift Card</span>
+      </span>
+      <span class="giftcard-hint">Combine with Credit/Debit card</span>
     </div>
 
     <div class="giftcard__container">

package/src/components/order-item.hbs

@@ -37,11 +37,24 @@
                 </div>
             </div>
             {{#if offers}}
-                <div class="order-item__offers">
-                    {{#each offers}}
-                        <div class="order-item__promo">{{this}}</div>
-                    {{/each}}
-                </div>
+                {{#ifCond switch-vat '&&' offersExcVat}}
+                    <div class="order-item__offers including-vat">
+                        {{#each offers}}
+                            <div class="order-item__promo">{{this}}</div>
+                        {{/each}}
+                    </div>
+                    <div class="order-item__offers excluding-vat d-none">
+                        {{#each offersExcVat}}
+                            <div class="order-item__promo">{{this}}</div>
+                        {{/each}}
+                    </div>
+                {{else}}
+                    <div class="order-item__offers">
+                        {{#each offers}}
+                            <div class="order-item__promo">{{this}}</div>
+                        {{/each}}
+                    </div>
+                {{/ifCond}}
             {{/if}}
         </div>
         <div class="order-item__cost">

package/src/components/order-summary.hbs

@@ -47,7 +47,7 @@
     </div>
   {{/if}}
   <div class="summary__aside">
-    {{> checkout_order-summary-new head=title mod=mod id=id}}
+    {{> checkout_order-summary-new head=title mod=mod id=id switch-vat=switch-vat}}
 
     {{#if klarna-placement}}
       <div class="summary__klarna">

package/src/components/payments.hbs

@@ -1,16 +1,15 @@
 <div class="payways">
   <p class="payways__title">Ways to Pay</p>
   <ul class="payways__list">
-    {{#if klarnaIcon}}
-      <li class="payways__item">
-        <img class="payways__image" src="./img/payment/footer/klarna.svg" alt="klarna">
-      </span>
-      </li>
-    {{/if}}
     {{#if billieIcon}}
       <li class="payways__item">
         <img class="payways__image" src="./img/payment/footer/billie.svg" alt="Billie">
       </li>
+    {{else}}
+      <li class="payways__item">
+        <img class="payways__image" src="./img/payment/footer/klarna.svg" alt="klarna">
+      </span>
+      </li>
     {{/if}}
     {{#each payments-list}}
       <li class="payways__item">

package/src/components/potential-promotion.hbs

@@ -2,9 +2,18 @@
     <div class="p-promotion__icon">
         <i class="icon fas fa-gift"></i>
     </div>
-    <div class="p-promotion__description">
-        {{description}}
-    </div>
+    {{#ifCond switch-vat '&&' descriptionExcVat}}
+        <div class="p-promotion__description including-vat">
+            {{description}}
+        </div>
+        <div class="p-promotion__description excluding-vat d-none">
+            {{descriptionExcVat}}
+        </div>
+    {{else}}
+        <div class="p-promotion__description">
+            {{description}}
+        </div>
+    {{/ifCond}}
     <div class="p-promotion__close">
         <i class="icon fas fa-times"></i>
     </div>

package/src/components/price-block-v2.hbs

@@ -181,6 +181,7 @@
                     {{/if}}
                 {{/unless}}
             ">
+                <p>Minimum order quantity for delivery is 4</p>
                 {{#unless isQuantity}}
                     <label for="quantity-field" class="quantity-label">Quantity: </label>
                     <input type="text" inputmode="numeric" required="" pattern="[0-9]*\d" id="quantity-field"

package/src/data/data_delivery-address-v2.json

@@ -77,10 +77,6 @@
         {
           "payment": "PayPal",
           "src": "./img/payment/checkout/paypal.svg"
-        },
-        {
-          "payment": "Gift Card",
-          "src": "./img/payment/checkout/giftcard.svg"
         }
       ]
     }

package/src/data/data_payments-checkout.json

@@ -23,10 +23,6 @@
     {
       "payment": "PayPal",
       "src": "./img/payment/checkout/paypal.svg"
-    },
-    {
-      "payment": "Gift Card",
-      "src": "./img/payment/checkout/giftcard.svg"
     }
   ]
 }

package/src/data/data_quick-filter.json

@@ -6,7 +6,7 @@
       "values": [
         {
           "text": null,
-          "additionalData": "./img/quick-filters/bath1.svg",
+          "additionalData": "./img/quick-filters/bath4.svg",
           "url": "?filter=icon1",
           "selected": false
         },
@@ -221,8 +221,8 @@
       "displayText": "Select Size",
       "values": [
         {
-          "text": "Double ended baths",
-          "additionalData": "./img/quick-filters/bath1.svg",
+          "text": "15 minute Click & Collect",
+          "additionalData": "./img/quick-filters/bath4.svg",
           "url": "?size=double",
           "selected": false
         },

package/src/data/data_shopping-cart-v2.json

@@ -8,10 +8,12 @@
     },
     "potentialOrderPromotions": [
       {
-        "description": "Spend over £200 on Bathroom Lighting and save £10.0"
+        "description": "Spend over £200 on Bathroom Lighting and save £10.0",
+        "descriptionExcVat": "Spend over £150 on Bathroom Lighting and save £10.0"
       },
       {
-        "description": "Spend over 2500 pound and get £2500 discount"
+        "description": "Spend over 2500 pound and get £2500 discount",
+        "descriptionExcVat": "Spend over 2000 pound and get £2000 discount"
       }
     ],
     "checkout": {
@@ -43,23 +45,28 @@
       "discounts": [
         {
           "text": "Voucher abcd applies and giving 20% off",
+          "textExcVat": "Voucher abcd applies and giving 18% off",
           "isDeletable": true
         },
         {
           "text": "Voucher 20% off",
+          "textExcVat": "Voucher 18% off",
           "isDeletable": true
         },
         {
-          "text": "Buy 4 for 3"
+          "text": "Buy 4 for 3",
+          "textExcVat": "Buy 5 for 3"
         },
         {
           "text": "Online only offer"
         },
         {
-          "text": "2 for £35"
+          "text": "2 for £35",
+          "textExcVat": "2 for £30"
         },
         {
-          "text": "Offer price equivalent to £17.50 per item"
+          "text": "Offer price equivalent to £17.50 per item",
+          "textExcVat": "Offer price equivalent to £15.50 per item"
         }
       ],
       "total": {
@@ -86,6 +93,10 @@
               "Buy 2 for 3 — Add 1 to qualify",
               "Buy 2 for 3 — Add 1 to qualify"
             ],
+            "offersExcVat": [
+              "Buy 2 for 4 — Add 2 to qualify",
+              "Buy 2 for 4 — Add 2 to qualify"
+            ],
             "pricePerSQM": {
               "value": "12"
             },
@@ -1049,6 +1060,10 @@
               "Buy 2 for 3 — Add 1 to qualify",
               "Buy 2 for 3 — Add 1 to qualify"
             ],
+            "offersExcVat": [
+              "Buy 2 for 4 — Add 2 to qualify",
+              "Buy 2 for 4 — Add 2 to qualify"
+            ],
             "message": "Purchased 12 times since your last visit 1 day ago",
             "infoTimeHead": "Available for Collection",
             "address": "Watford",
@@ -1109,6 +1124,9 @@
             "totalMobile": "16",
             "offers": [
               "Buy 2 Wickes Romano Bathroom Door Handle - Polished Chrome 1 Pair, Wickes Romano Locking Door Handle - Satin Nickel 1 Pair, Wickes Passage Door Knob Set - Brass 1 Pair for £8 - Add 1 to qualify"
+            ],
+            "offersExcVat": [
+              "Buy 2 Wickes Romano Bathroom Door Handle - Polished Chrome 1 Pair, Wickes Romano Locking Door Handle - Satin Nickel 1 Pair, Wickes Passage Door Knob Set - Brass 1 Pair for £7 - Add 1 to qualify"
             ]
           },
           {

package/src/data/footer_menu.json

@@ -187,10 +187,6 @@
     {
       "payment": "PayPal",
       "src": "./img/payment/footer/paypal.svg"
-    },
-    {
-      "payment": "Gift Card",
-      "src": "./img/payment/footer/giftcard.svg"
     }
   ]
 }

package/src/js/emulation/checkout-payment-details.js

@@ -1,16 +1,9 @@
-window.Wick = window.Wick || {};
-window.Wick.BillieData = window.Wick.BillieData || {};
-window.Wick.BillieData.billiePaymentTerms = ['30', '60', '90'];
-window.INIT_KLARNA_PAYMENT = window.INIT_KLARNA_PAYMENT || 'INIT_KLARNA_PAYMENT';
-window.INIT_BILLIE_PAYMENT = window.INIT_BILLIE_PAYMENT || 'INIT_BILLIE_PAYMENT';
+var Wick = Wick || {};
 
 Wick.PaymentDetails = (function () {
     var $btnEnterDetails = $('.btn-enter-details'),
         isGuestPage = $('.page_checkout-payment-details_guest').length;
 
-    const $billieInfo = $('.checkout-payment-details__billie .billie-info');
-    const $klarnaInfo = $('.checkout-payment-details__klarna .klarna-info');
-
     function bindEvents() {
         $btnEnterDetails.on('click', function (e) {
             e.preventDefault();
@@ -56,24 +49,6 @@ Wick.PaymentDetails = (function () {
             Wick.Forms.showValidationErrors(this);
             return false;
         });
-
-        $(window).on(window.INIT_BILLIE_PAYMENT, function (e) {
-            const detail = e.detail || (e.originalEvent && e.originalEvent.detail) || {};
-
-            if (detail && detail.resolve) {
-                $billieInfo.show();
-                detail.resolve();
-            }
-        });
-
-        $(window).on(window.INIT_KLARNA_PAYMENT, function (e) {
-            const detail = e.detail || (e.originalEvent && e.originalEvent.detail) || {};
-
-            if (detail && detail.resolve) {
-                $klarnaInfo.show();
-                detail.resolve();
-            }
-        });
     }
 
     bindEvents();