wickes-css2 2.98.0-develop.1 → 2.98.0-develop.10

package/src/img/billie-spinner.svg

@@ -0,0 +1,5 @@
+<svg width="111" height="38" viewBox="0 0 111 38" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="Group">
+<path id="Vector" fill-rule="evenodd" clip-rule="evenodd" d="M24.1126 11.634C24.1126 13.086 23.953 14.675 23.6486 16.1599L23.6533 16.1552C26.5152 18.4111 28.2071 21.8351 28.2071 25.4578C28.2071 32.0125 22.7928 37.3473 16.1458 37.3473H0V11.8895C0 8.62159 1.38251 5.46225 3.79482 3.22538C6.04258 1.1445 8.97215 0 12.0419 0C12.3027 0 12.5688 0.00946354 12.8297 0.0236584C19.0465 0.411457 24.1126 5.61839 24.1126 11.634ZM11.1958 31.7857H16.1364C19.6701 31.7857 22.5464 28.9481 22.5464 25.4626C22.5464 23.7222 21.8357 22.1521 20.6852 21.0076C18.5051 25.1032 15.3966 28.6358 11.1958 31.7857ZM18.1907 14.6088C18.3456 13.7292 18.4663 12.6841 18.4663 11.6292C18.4663 8.5033 15.7787 5.784 12.477 5.58054C10.6835 5.46698 8.97687 6.07235 7.67178 7.28309C6.36642 8.49383 5.64631 10.1301 5.64631 11.8942V14.6088H18.1907ZM16.1364 19.1347H5.64631H5.6366V30.0879C10.6979 26.9049 14.1736 23.396 16.4891 19.1442C16.3731 19.1347 16.2524 19.1347 16.1364 19.1347ZM47.3827 0.657363V31.6106C47.3827 35.6968 49.6837 38 53.5751 38C55.1608 38 56.6496 37.6217 57.7035 37.1533L56.3596 32.9255C55.9777 33.0627 55.4943 33.157 54.9673 33.157C53.9087 33.157 53.5268 32.5943 53.5268 31.4216V0L47.3827 0.657363ZM62.2048 0.657363V31.6106C62.2048 35.6968 64.5059 38 68.3973 38C69.9829 38 71.4717 37.6217 72.5256 37.1533L71.1817 32.9255C70.7999 33.0627 70.3165 33.157 69.7895 33.157C68.7308 33.157 68.349 32.5943 68.349 31.4216V0L62.2048 0.657363ZM110.86 26.7493H95.1006C95.5743 31.7623 97.9478 33.3892 101.274 33.3892C103.502 33.3892 105.354 32.6939 107.539 31.209L110.053 34.5999C107.582 36.5532 104.546 37.8962 100.747 37.8962C92.9591 37.8962 88.7825 32.8358 88.7825 25.0751C88.7825 17.3144 92.819 11.9323 99.9397 11.9323C107.06 11.9323 111 16.5766 111 24.3325C111 24.973 110.94 25.7345 110.891 26.3477C110.88 26.4907 110.869 26.6257 110.86 26.7493ZM104.866 22.5827C104.866 18.5391 103.396 16.1273 99.9735 16.1273C97.1261 16.1273 95.3229 17.9858 94.9893 22.8618H104.866V22.5827ZM40.8387 3.71171C40.8387 5.70746 39.2677 7.28699 36.9908 7.28699V7.28226C34.7572 7.28226 33.191 5.75004 33.191 3.70698C33.191 1.66392 34.709 0.0843347 36.9908 0.0843347C39.2725 0.0843347 40.8387 1.71594 40.8387 3.71171ZM34.0069 12.052V37.0086H40.151V11.3993L34.0069 12.052ZM83.6587 3.71171C83.6587 5.70746 82.0878 7.28699 79.8109 7.28699V7.28226C77.5775 7.28226 76.011 5.75004 76.011 3.70698C76.011 1.66392 77.534 0.0843347 79.8109 0.0843347C82.0878 0.0843347 83.6587 1.71594 83.6587 3.71171ZM76.6687 12.052V37.0086H82.8129V11.3993L76.6687 12.052Z" fill="white"/>
+</g>
+</svg>

package/src/img/billie.svg

@@ -0,0 +1,4 @@
+<svg width="48" height="30" viewBox="0 0 48 30" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <rect width="48" height="30" rx="3" fill="#1C1C1E"/>
+    <path fill-rule="evenodd" clip-rule="evenodd" d="M14.5745 12.7945C14.5745 13.2293 14.5266 13.705 14.4352 14.1496L14.4366 14.1482C15.296 14.8236 15.8041 15.8488 15.8041 16.9334C15.8041 18.8959 14.1782 20.4932 12.1821 20.4932H7.3335V12.871C7.3335 11.8926 7.74866 10.9467 8.47308 10.277C9.14808 9.65395 10.0278 9.31128 10.9497 9.31128C11.028 9.31128 11.1079 9.31411 11.1862 9.31836C13.0532 9.43447 14.5745 10.9934 14.5745 12.7945ZM10.6956 18.828H12.1792C13.2404 18.828 14.1042 17.9784 14.1042 16.9349C14.1042 16.4138 13.8907 15.9437 13.5452 15.601C12.8906 16.8273 11.9571 17.8849 10.6956 18.828ZM12.7962 13.6852C12.8427 13.4219 12.8789 13.1089 12.8789 12.7931C12.8789 11.8572 12.0718 11.043 11.0803 10.9821C10.5417 10.9481 10.0292 11.1294 9.63733 11.4919C9.24533 11.8544 9.02908 12.3443 9.02908 12.8724V13.6852H12.7962ZM12.1792 15.0403H9.02908H9.02616V18.3197C10.5461 17.3667 11.5898 16.3161 12.2852 15.0431C12.2503 15.0403 12.2141 15.0403 12.1792 15.0403ZM21.5625 9.5081V18.7756C21.5625 19.999 22.2535 20.6886 23.4221 20.6886C23.8982 20.6886 24.3453 20.5754 24.6618 20.4351L24.2582 19.1693C24.1436 19.2104 23.9984 19.2386 23.8402 19.2386C23.5222 19.2386 23.4076 19.0701 23.4076 18.719V9.31128L21.5625 9.5081ZM26.0136 9.5081V18.7756C26.0136 19.999 26.7046 20.6886 27.8732 20.6886C28.3493 20.6886 28.7964 20.5754 29.1129 20.4351L28.7093 19.1693C28.5947 19.2104 28.4495 19.2386 28.2912 19.2386C27.9733 19.2386 27.8587 19.0701 27.8587 18.719V9.31128L26.0136 9.5081ZM40.6247 17.3201H35.8922C36.0344 18.821 36.7472 19.3081 37.746 19.3081C38.4152 19.3081 38.9712 19.0999 39.6273 18.6554L40.3822 19.6706C39.6404 20.2554 38.7287 20.6575 37.5877 20.6575C35.2491 20.6575 33.9948 19.1424 33.9948 16.8189C33.9948 14.4953 35.207 12.8839 37.3453 12.8839C39.4837 12.8839 40.6667 14.2744 40.6667 16.5965C40.6667 16.7883 40.6486 17.0163 40.634 17.1999C40.6306 17.2427 40.6274 17.2831 40.6247 17.3201ZM38.8246 16.0726C38.8246 14.8619 38.3832 14.1399 37.3555 14.1399C36.5004 14.1399 35.9589 14.6963 35.8587 16.1562H38.8246V16.0726ZM19.5973 10.4226C19.5973 11.0201 19.1256 11.493 18.4418 11.493V11.4916C17.7711 11.4916 17.3007 11.0329 17.3007 10.4212C17.3007 9.80946 17.7566 9.33653 18.4418 9.33653C19.127 9.33653 19.5973 9.82504 19.5973 10.4226ZM17.5457 12.9197V20.3918H19.3908V12.7243L17.5457 12.9197ZM32.4562 10.4226C32.4562 11.0201 31.9844 11.493 31.3007 11.493V11.4916C30.63 11.4916 30.1596 11.0329 30.1596 10.4212C30.1596 9.80946 30.6169 9.33653 31.3007 9.33653C31.9844 9.33653 32.4562 9.82504 32.4562 10.4226ZM30.3571 12.9197V20.3918H32.2022V12.7243L30.3571 12.9197Z" fill="white"/>
+</svg>

package/src/img/payment/checkout/billie.svg

@@ -0,0 +1,4 @@
+<svg width="48" height="30" viewBox="0 0 48 30" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect width="48" height="30" rx="3" fill="#1C1C1E"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M14.5745 12.7948C14.5745 13.2295 14.5266 13.7053 14.4352 14.1499L14.4366 14.1484C15.296 14.8239 15.8041 15.849 15.8041 16.9337C15.8041 18.8962 14.1782 20.4934 12.1821 20.4934H7.3335V12.8713C7.3335 11.8929 7.74866 10.9469 8.47308 10.2772C9.14808 9.65419 10.0278 9.31152 10.9497 9.31152C11.028 9.31152 11.1079 9.31436 11.1862 9.31861C13.0532 9.43472 14.5745 10.9937 14.5745 12.7948ZM10.6956 18.8283H12.1792C13.2404 18.8283 14.1042 17.9787 14.1042 16.9351C14.1042 16.414 13.8907 15.9439 13.5452 15.6013C12.8906 16.8275 11.9571 17.8852 10.6956 18.8283ZM12.7962 13.6854C12.8427 13.4221 12.8789 13.1092 12.8789 12.7934C12.8789 11.8574 12.0718 11.0433 11.0803 10.9824C10.5417 10.9484 10.0292 11.1296 9.63733 11.4921C9.24533 11.8546 9.02908 12.3445 9.02908 12.8727V13.6854H12.7962ZM12.1792 15.0405H9.02908H9.02616V18.3199C10.5461 17.3669 11.5898 16.3164 12.2852 15.0434C12.2503 15.0405 12.2141 15.0405 12.1792 15.0405ZM21.5625 9.50834V18.7759C21.5625 19.9993 22.2535 20.6889 23.4221 20.6889C23.8982 20.6889 24.3453 20.5756 24.6618 20.4354L24.2582 19.1695C24.1436 19.2106 23.9984 19.2389 23.8402 19.2389C23.5222 19.2389 23.4076 19.0704 23.4076 18.7193V9.31152L21.5625 9.50834ZM26.0136 9.50834V18.7759C26.0136 19.9993 26.7046 20.6889 27.8732 20.6889C28.3493 20.6889 28.7964 20.5756 29.1129 20.4354L28.7093 19.1695C28.5947 19.2106 28.4495 19.2389 28.2912 19.2389C27.9733 19.2389 27.8587 19.0704 27.8587 18.7193V9.31152L26.0136 9.50834ZM40.6247 17.3204H35.8922C36.0344 18.8213 36.7472 19.3084 37.746 19.3084C38.4152 19.3084 38.9712 19.1002 39.6273 18.6556L40.3822 19.6709C39.6404 20.2557 38.7287 20.6578 37.5877 20.6578C35.2491 20.6578 33.9948 19.1427 33.9948 16.8191C33.9948 14.4955 35.207 12.8841 37.3453 12.8841C39.4837 12.8841 40.6667 14.2746 40.6667 16.5968C40.6667 16.7885 40.6486 17.0165 40.634 17.2001C40.6306 17.2429 40.6274 17.2834 40.6247 17.3204ZM38.8246 16.0729C38.8246 14.8622 38.3832 14.1401 37.3555 14.1401C36.5004 14.1401 35.9589 14.6965 35.8587 16.1564H38.8246V16.0729ZM19.5973 10.4228C19.5973 11.0204 19.1256 11.4933 18.4418 11.4933V11.4919C17.7711 11.4919 17.3007 11.0331 17.3007 10.4214C17.3007 9.80971 17.7566 9.33677 18.4418 9.33677C19.127 9.33677 19.5973 9.82528 19.5973 10.4228ZM17.5457 12.9199V20.392H19.3908V12.7245L17.5457 12.9199ZM32.4562 10.4228C32.4562 11.0204 31.9844 11.4933 31.3007 11.4933V11.4919C30.63 11.4919 30.1596 11.0331 30.1596 10.4214C30.1596 9.80971 30.6169 9.33677 31.3007 9.33677C31.9844 9.33677 32.4562 9.82528 32.4562 10.4228ZM30.3571 12.9199V20.392H32.2022V12.7245L30.3571 12.9199Z" fill="white"/>
+</svg>

package/src/img/payment/footer/billie.svg

@@ -0,0 +1,4 @@
+<svg width="48" height="30" viewBox="0 0 48 30" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <rect width="48" height="30" rx="3" fill="#1C1C1E"/>
+    <path fill-rule="evenodd" clip-rule="evenodd" d="M14.5745 12.7945C14.5745 13.2293 14.5266 13.705 14.4352 14.1496L14.4366 14.1482C15.296 14.8236 15.8041 15.8488 15.8041 16.9334C15.8041 18.8959 14.1782 20.4932 12.1821 20.4932H7.3335V12.871C7.3335 11.8926 7.74866 10.9467 8.47308 10.277C9.14808 9.65395 10.0278 9.31128 10.9497 9.31128C11.028 9.31128 11.1079 9.31411 11.1862 9.31836C13.0532 9.43447 14.5745 10.9934 14.5745 12.7945ZM10.6956 18.828H12.1792C13.2404 18.828 14.1042 17.9784 14.1042 16.9349C14.1042 16.4138 13.8907 15.9437 13.5452 15.601C12.8906 16.8273 11.9571 17.8849 10.6956 18.828ZM12.7962 13.6852C12.8427 13.4219 12.8789 13.1089 12.8789 12.7931C12.8789 11.8572 12.0718 11.043 11.0803 10.9821C10.5417 10.9481 10.0292 11.1294 9.63733 11.4919C9.24533 11.8544 9.02908 12.3443 9.02908 12.8724V13.6852H12.7962ZM12.1792 15.0403H9.02908H9.02616V18.3197C10.5461 17.3667 11.5898 16.3161 12.2852 15.0431C12.2503 15.0403 12.2141 15.0403 12.1792 15.0403ZM21.5625 9.5081V18.7756C21.5625 19.999 22.2535 20.6886 23.4221 20.6886C23.8982 20.6886 24.3453 20.5754 24.6618 20.4351L24.2582 19.1693C24.1436 19.2104 23.9984 19.2386 23.8402 19.2386C23.5222 19.2386 23.4076 19.0701 23.4076 18.719V9.31128L21.5625 9.5081ZM26.0136 9.5081V18.7756C26.0136 19.999 26.7046 20.6886 27.8732 20.6886C28.3493 20.6886 28.7964 20.5754 29.1129 20.4351L28.7093 19.1693C28.5947 19.2104 28.4495 19.2386 28.2912 19.2386C27.9733 19.2386 27.8587 19.0701 27.8587 18.719V9.31128L26.0136 9.5081ZM40.6247 17.3201H35.8922C36.0344 18.821 36.7472 19.3081 37.746 19.3081C38.4152 19.3081 38.9712 19.0999 39.6273 18.6554L40.3822 19.6706C39.6404 20.2554 38.7287 20.6575 37.5877 20.6575C35.2491 20.6575 33.9948 19.1424 33.9948 16.8189C33.9948 14.4953 35.207 12.8839 37.3453 12.8839C39.4837 12.8839 40.6667 14.2744 40.6667 16.5965C40.6667 16.7883 40.6486 17.0163 40.634 17.1999C40.6306 17.2427 40.6274 17.2831 40.6247 17.3201ZM38.8246 16.0726C38.8246 14.8619 38.3832 14.1399 37.3555 14.1399C36.5004 14.1399 35.9589 14.6963 35.8587 16.1562H38.8246V16.0726ZM19.5973 10.4226C19.5973 11.0201 19.1256 11.493 18.4418 11.493V11.4916C17.7711 11.4916 17.3007 11.0329 17.3007 10.4212C17.3007 9.80946 17.7566 9.33653 18.4418 9.33653C19.127 9.33653 19.5973 9.82504 19.5973 10.4226ZM17.5457 12.9197V20.3918H19.3908V12.7243L17.5457 12.9197ZM32.4562 10.4226C32.4562 11.0201 31.9844 11.493 31.3007 11.493V11.4916C30.63 11.4916 30.1596 11.0329 30.1596 10.4212C30.1596 9.80946 30.6169 9.33653 31.3007 9.33653C31.9844 9.33653 32.4562 9.82504 32.4562 10.4226ZM30.3571 12.9197V20.3918H32.2022V12.7243L30.3571 12.9197Z" fill="white"/>
+</svg>

package/src/js/components/general/notification.js

@@ -20,7 +20,7 @@ Wick.Notification = (function(){
   }
 
   $(document).on('click', '.notification__close', function(){
-    $(this).parents('.notification, .notification_app, .sticky-wrapper, .google_banner').remove();
+    $(this).parents('.notification, .notification_app, .sticky-wrapper').remove();
   });
 
   return {

package/src/js/emulation/paymentLoader.js

@@ -1,14 +1,25 @@
-const paymentLoader = '.payment-loader';
-const paymentLoaderHideClass = 'payment-loader--hidden';
-const applePayButton = '.apple__button';
-const googlePayButton = '.google__button';
-const clearPayRadioButton = '#checkout-payment-details-clearpay';
+const paymentLoader= '.payment-loader';
+const paymentLoaderHideClass= 'payment-loader--hidden';
+const paymentLoaderModal = '.payment-loader__modal'
+const paymentTypeSelectors = {
+  apple: '.apple__button',
+  google: '.google__button',
+  clearpay: '#checkout-payment-details-clearpay',
+  billie: '#checkout-payment-details-billie, .billie__button',
+  paypal: '#checkout-payment-details-paypal'
+};
 
-const showPaymentLoader = () => {
+function showPaymentLoader(paymentType) {
+  $(paymentLoader).find(`${paymentLoaderModal} > div`).hide();
+  $(`.${paymentType}-checkout-logo`).show();
+  $(`${paymentLoader} .spinner`).show();
   $(paymentLoader).removeClass(paymentLoaderHideClass);
-  setTimeout(() => $(paymentLoader).addClass(paymentLoaderHideClass), 1000);
-};
 
-$(document).on('click', applePayButton, showPaymentLoader);
-$(document).on('click', googlePayButton, showPaymentLoader);
-$(document).on('click', clearPayRadioButton, showPaymentLoader);
+  setTimeout(() => {
+    $(paymentLoader).addClass(paymentLoaderHideClass);
+  }, 1000);
+}
+
+Object.entries(paymentTypeSelectors).forEach(([type, triggerSelector]) => {
+  $(document).on('click', triggerSelector, () => showPaymentLoader(type));
+});

package/src/js/page/basket-v2.js

@@ -16,8 +16,8 @@ import {checkPayPalAvailability} from './basket/paypal';
 import {
     updateCharity,
     changeCharityPrice,
-    toggleCharityElements,
-    setDefaultCharityValue
+    setDefaultCharityValue,
+    initCharityInteractions,
 } from './components/charity';
 import {callAction} from './utils/http-action';
 import {ROUTES} from './utils/routes';
@@ -29,8 +29,8 @@ import {
 } from './basket/session-sync'
 import {displayEnergyEfficiency} from "./basket/display-energy-efficiency";
 import {appendLoader, hideLoader, showLoader} from "./utils/loader";
-import {addClassToSummaryAside} from "./basket/summary-mobile";
 import { initStickyObserver } from './components/sticky-order-observer';
+import {addClassToSummaryAside} from "./basket/summary-mobile";
 
 var Wick = window.Wick || {};
 Wick.BasketPage = {
@@ -80,7 +80,7 @@ Wick.BasketPage = {
         orderItemInfoOffers: 'order-item__info-offers',
         charityInput: '#donation',
         charityItem: '.charity-new',
-        donationCartBtn: '.donation-cart__btn',
+        donationCartBtn: '.donation-cart__btn, .donation-cart-new__btn',
         checkoutWidgetDetails: '.checkout-widget__details',
         checkoutWidgetDetailsFlex: 'checkout-widget__details-flex',
         subtotal: '.checkout-widget__item-bold',
@@ -311,7 +311,6 @@ Wick.BasketPage = {
         } else {
             if (charity) {
                 Wick.BasketPage.updateCart();
-                quantityToUpdate === 0 && toggleCharityElements();
             } else {
                 if (maxValue > 1 || minValue > 1) {
                     if (quantityToUpdate > maxValue || quantityToUpdate < minValue) {
@@ -1282,8 +1281,16 @@ $(document).ready(function () {
         $(Wick.BasketPage.el.content).on('focusout', Wick.BasketPage.el.quantityValue, Wick.BasketPage.changeOnBlur);
         $(Wick.BasketPage.el.content).on('click', Wick.BasketPage.el.deliveryButtonInCC, Wick.BasketPage.changeMethodToDelivery);
         $(Wick.BasketPage.el.content).on('click', Wick.BasketPage.el.updateStoreButton, Wick.BasketPage.changeMethodToCC);
-        $(Wick.BasketPage.el.charityInput).on('click', updateCharity);
-        $(Wick.BasketPage.el.donationCartBtn).on('click', changeCharityPrice);
+        $(Wick.BasketPage.el.donationCartBtn).on('click', function(e) {
+            e.preventDefault();
+            const context = $(this).closest(Wick.BasketPage.el.charityItem);
+            if (!context.hasClass('charity-added')) {
+                updateCharity(this);
+                context.addClass('charity-added');
+            } else {
+                changeCharityPrice.call(this);
+            }
+        });
         $(Wick.BasketPage.el.charityItem).on('click', Wick.BasketPage.el.removeButton, updateCharity);
         $(Wick.BasketPage.el.orderSummary).on('click', Wick.BasketPage.el.voucherRemove, voucherRemove);
         $(Wick.BasketPage.el.promoWrapper).on('click', Wick.BasketPage.el.promoClose, Wick.BasketPage.removePromotion);
@@ -1305,7 +1312,9 @@ $(document).ready(function () {
             '.summary__aside.collapse.show'
         );
         Wick.BasketPage.updateCart(...Array(3), true);
+
         setDefaultCharityValue();
+        initCharityInteractions();
         if (!$(Wick.BasketPage.el.loader).length) {
             appendLoader(Wick.BasketPage.loaderPayload);
         }

package/src/js/page/billie-business-type.js

@@ -0,0 +1,34 @@
+var Wick = window.Wick || {};
+
+Wick.BusinessType = {
+  el: {
+    radios: 'input[name="businessType"]',
+    panels: '.radio-expanded-content'
+  },
+
+  refreshPanels() {
+    const $radios = $(this.el.radios);
+    const $panels = $(this.el.panels);
+    const selectedValue = $radios.filter(':checked').val();
+
+    $panels.hide();
+    $(`#${selectedValue}-fields`).show();
+  },
+
+  bindEvents() {
+    $(this.el.radios).on('change', this.refreshPanels.bind(this));
+  },
+
+  init() {
+    if (!$(this.el.radios).length) {
+      return;
+    }
+
+    this.refreshPanels();
+    this.bindEvents();
+  }
+};
+
+$(document).ready(function () {
+  Wick.BusinessType.init();
+});

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

@@ -62,6 +62,14 @@ Wick.CheckoutPaymentDetails = (function() {
       case 'klarna':
         hideBillingAddres();
         break;
+      case 'billie':
+        detailsLabel = {
+          ...detailsLabel,
+          labelText: 'Name on Billie account',
+          buttonText: 'Pay with Billie'
+        }
+        changeLabelText(detailsLabel);
+        break;
       case 'clearpay':
         detailsLabel = {
           ...detailsLabel,

package/src/js/page/components/charity.js

@@ -8,34 +8,47 @@ const charityEl = {
   charityInput: '#donation',
   charityTitleWrap: '.title-wrap',
   donationCart: '.donation-cart',
-  donationCartBtn: '.donation-cart__btn',
-  donationCartHolder: '.donation-cart__holder',
   donationCartHide: 'donation-cart__hide',
-  donationCartValue: '.donation-cart__value',
+  donationCartBtn: '.donation-cart__btn, .donation-cart-new__btn',
+  donationCartBtnSelected: '.donation-cart-new__btn.btn-selected',
+  donationCartHolder: '.donation-cart__holder, .donation-cart-new__holder',
+  donationCartValue: '.donation-cart__value, .donation-cart-new__value',
   charityAdded: 'charity-added',
+  donationCartCostBlock: '.donation-cart-new__cost',
+  donationCartCostBlockHide: 'donation-cart-new__cost-hide',
+  donationCartRemove: '.donation-cart-new__cost .order-item__remove',
 }
 
-export function updateCharity() {
-  //checkbox action
+export function updateCharity(button) {
   if ($('#donation').attr('disabled') === 'disabled') {
-    $('#donation').removeAttr('disabled')
+    $('#donation').removeAttr('disabled');
   } else {
     $('#donation').prop('disabled', (_, value) => !value);
   }
 
-  const context = getCurrentCharityItem(this);
+  const context = getCurrentCharityItem(button);
   const productCode = getCurrentProductCode(context);
+  const quantity = getSelectedCharityAmount(button);
 
   showLoader('.basket-loader');
 
   if (context.hasClass(charityEl.charityAdded)) {
-    $(this).removeAttr('checked');
+    $(button).removeAttr('checked');
   } else {
-    $(this).attr('checked', 'checked');
-    charityActionForAdd(productCode);
+    $(button).attr('checked', 'checked');
+    repaintCharityButton(button);
+    context
+      .find(charityEl.donationCartValue)
+      .text(quantity);
+    showDonationCostBlock(context);
+    charityActionForAdd(productCode, quantity);
   }
 }
 
+function getSelectedCharityAmount(context) {
+  return $(context).data('value');
+}
+
 function getCurrentCharityItem(context) {
   return $(context).closest(charityEl.charityItem);
 }
@@ -44,13 +57,13 @@ function getCurrentProductCode(context) {
   return context.find('input[name="productCode"]').val();
 }
 
-export function charityActionForAdd(value) {
+export function charityActionForAdd(value, quantity) {
   if (!Wick.checkLocalEnv) {
     const payload = {
       url: ROUTES.CHARITY_ADD,
       queries: {
         productCodePost: value,
-        qty: getDefaultCharityAmount(),
+        qty: quantity,
       },
       type: 'POST',
     };
@@ -61,19 +74,10 @@ export function charityActionForAdd(value) {
 
     callAction(payload, executeCharityAction, productInfo);
   } else {
-    toggleCharityElements();
     Wick.BasketPage.updateCart(...Array(2), true);
   }
 }
 
-export function toggleCharityElements() {
-  if ($(charityEl.charityItem).hasClass(charityEl.charityAdded)) {
-    $(charityEl.charityInput).prop('checked', false);
-  }
-  $(charityEl.charityItem).toggleClass(charityEl.charityAdded);
-  $(charityEl.charityItem).hasClass(charityEl.charityMultiple) && toggleMultipleCharityChoose($(charityEl.charityItem));
-}
-
 function executeCharityAction(response, productInfo) {
   if (response.addedProducts && response.addedProducts[0]) {
     productInfo.quantity = response.addedProducts[0].qty;
@@ -81,7 +85,6 @@ function executeCharityAction(response, productInfo) {
   }
 
   Wick.BasketPage.updateCart(...Array(2), true);
-  toggleCharityElements();
 }
 
 export function changeCharityPrice() {
@@ -95,6 +98,7 @@ export function changeCharityPrice() {
 
   repaintCharityButton(this);
   $(charityEl.donationCartValue).text(charityValue);
+  showDonationCostBlock(context);
   charityActionForChangePrice(this);
 }
 
@@ -119,35 +123,46 @@ function repaintCharityButton(context) {
   $(context).removeClass(btnSecondary).addClass(btnSelected);
 }
 
-function resetCharityButton(context) {
-  const donationButtons = $(context).find(charityEl.donationCartBtn);
-  const btnSelected = 'btn-selected';
-  const btnSecondary = 'btn-secondary';
-  const defaultAmount = getDefaultCharityAmount();
-
-  donationButtons.each((i, btn) => {
-    $(btn).attr('data-value') === defaultAmount
-      ? $(btn).removeClass(btnSecondary).addClass(btnSelected)
-      : $(btn).removeClass(btnSelected).addClass(btnSecondary);
-  })
-}
-
 function getDefaultCharityAmount() {
   const donationButtons = $(charityEl.charityItem).find(charityEl.donationCartBtn);
   return donationButtons.first().attr('data-value');
 }
 
+export function setDefaultCharityValue() {
+  $(charityEl.donationCartBtnSelected).each(function() {
+    const $btn   = $(this);
+    const $item  = $btn.closest(charityEl.charityItem);
+    const value  = $btn.data('value');
+
+    $item.find(charityEl.donationCartValue).text(value);
+    $item.find(charityEl.donationCartCostBlock)
+      .removeClass(charityEl.donationCartCostBlockHide);
+  });
+}
+
+function showDonationCostBlock($charity) {
+  $charity.find(charityEl.donationCartCostBlock)
+    .removeClass(charityEl.donationCartCostBlockHide);
+}
+
 function resetCharityValue() {
   const defaultValue = getDefaultCharityAmount();
   $(charityEl.donationCartValue).text(defaultValue);
 }
 
-export function toggleMultipleCharityChoose(context) {
-  context.find(charityEl.donationCart).toggleClass(charityEl.donationCartHide);
-  resetCharityButton(context);
-  resetCharityValue();
-}
-
-export function setDefaultCharityValue() {
-  $(charityEl.charityItem).hasClass(charityEl.charityMultiple) && resetCharityValue();
+export function initCharityInteractions() {
+  $(document).on('click', charityEl.donationCartRemove, function(e) {
+    e.preventDefault();
+
+    const $item = $(this).closest(charityEl.charityItem);
+    $item.removeClass(charityEl.charityAdded);
+    $item
+      .find(charityEl.donationCartCostBlock)
+      .addClass(charityEl.donationCartCostBlockHide);
+    $item
+      .find(charityEl.donationCartBtn)
+      .removeClass('btn-selected')
+      .addClass('btn-secondary');
+    resetCharityValue();
+  });
 }

package/src/js/page/components/modal-observer.js

@@ -0,0 +1,51 @@
+var Wick = Wick || {};
+
+Wick.ModalObserver = (function () {
+  const modal = $('.modal-scroll-observer');
+    modalContent = modal.find('.modal-content'),
+    modalBody = modal.find('.modal-body');
+
+  $(document).ready(function () {
+    if (!modal.length) {
+      return;
+    }
+
+    function updateScrollFades() {
+      const tolerance = 5;
+      const scrollTop = modalBody.scrollTop();
+      const scrollHeight = modalBody.prop('scrollHeight');
+      const visibleHeight = modalBody.outerHeight();
+
+      const isAtTop = scrollTop <= tolerance;
+      const isAtBottom = scrollTop + visibleHeight >= scrollHeight - tolerance;
+
+      let state;
+
+      if (isAtTop && isAtBottom) {
+        state = 'full';
+      } else if (isAtTop) {
+        state = 'top';
+      } else if (isAtBottom) {
+        state = 'bottom';
+      } else {
+        state = 'middle';
+      }
+
+      modalContent.attr('data-scroll-state', state);
+    }
+
+    modalBody.on('scroll', updateScrollFades);
+
+    modal.on('shown.bs.modal', function() {
+      updateScrollFades();
+    });
+
+    $(window).on('resize', function() {
+      if (modal.is(':visible')) {
+        updateScrollFades();
+      }
+    });
+
+  });
+
+})();

package/src/js/page/smart-banner.js

@@ -21,10 +21,13 @@ Wick.SmartBanner = {
         $(Wick.SmartBanner.CLOSE_BUTTON_SELECTOR).on('click', Wick.SmartBanner.closeBanner);
         $(Wick.SmartBanner.OPEN_BUTTON_SELECTOR).on('click', Wick.SmartBanner.handleOpenClick);
         $(Wick.SmartBanner.INSTALL_BUTTON_SELECTOR).on('click', Wick.SmartBanner.handleInstallClick);
+        if ('scrollRestoration' in history) {
+            history.scrollRestoration = 'manual';
+        }
     },
 
     hideBanner: function () {
-        $(Wick.SmartBanner.BANNER_SELECTOR).removeClass('show');
+        $(Wick.SmartBanner.BANNER_SELECTOR).addClass('hide');
     },
 
     closeBanner: function (e) {

package/src/layouts/base.hbs

@@ -9,9 +9,6 @@
     <!-- Google Tag Manager (noscript) -->
     <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-M3LZ2SC" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
     <!-- End Google Tag Manager (noscript) -->
-    {{#if googleBanner}}
-        {{> google-banner}}
-    {{/if}}
     {{#if smartBannerDIY}}
         {{> smart-banner
                 logoUrl="https://eu-images.contentstack.com/v3/assets/blt176fda34ff2a0cbd/blt7d7f7424d4d70982/684c28b1ec8c98397d81a2cc/Wickes_logo.svg?branch=development"

package/src/layouts/bicester-kitchen.hbs

@@ -13,9 +13,6 @@
     {{#unless hideBanner}}
       {{> offer-banner}}
     {{/unless}}
-    {{#if googleBanner}}
-        {{> google-banner}}
-    {{/if}}
     {{#block "header"}}
       {{> header bicester="true" }}
     {{/block}}

package/src/layouts/my-account.hbs

@@ -20,9 +20,6 @@
   <!-- Google Tag Manager (noscript) -->
   <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-M3LZ2SC" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
   <!-- End Google Tag Manager (noscript) -->
-    {{#if googleBanner}}
-        {{> google-banner}}
-    {{/if}}
 
     {{#block "header"}}
       {{> header }}

package/src/page_basket-billie.html

@@ -0,0 +1,54 @@
+{{#extend "basket-new" page_shopping-cart pageClass="page_basket basket" title="Basket-Billie" clearPayIcon=true pageBasket=true billieIcon=true}}
+{{#content "head" mode="append"}}
+<link type="text/css" rel="stylesheet" href="./css/pages/page_shopping-cart-v2.css">
+<link type="text/css" rel="stylesheet" href="./css/pages/checkout-new.css">
+{{/content}}
+{{#content "heading"}}
+<div class="notification-area pr-0 pl-0">
+  {{> notifications notification-page.warning-tiles-changed withCloseBtn="true"}}
+</div>
+<div class="checkout-header__promo">
+  {{#each shopping-cart-v2.potentialOrderPromotions}}
+  {{> potential-promotion}}
+  {{/each}}
+</div>
+{{> checkout-header shopping-cart-v2.header}}
+{{/content}}
+{{#content "aside"}}
+{{> order-summary
+shopping-cart-v2.checkout
+id=1
+title="Order Summary"
+basket=true
+clearPayIcon=clearPayIcon
+billie-placement=true
+clearpay-placement=true
+klarna-placement=false
+billieIcon=true
+paymentsCheckoutV2=true
+}}
+{{> checkout-action  mod="mounted"}}
+{{> summary-payment paymentsCheckoutV2="true" billieIcon=true}}
+{{> checkout-action  mod="large"}}
+{{/content}}
+{{#content "main"}}
+<input type="hidden" id="SUPPLIER_DELIVERED_7_DAYS" value="<b> Wickes Supplier </b> - Delivery within 7 days">
+<input type="hidden" id="STANDARD" value="<b> STANDARD </b> - Delivery within 1 day">
+<input type="hidden" id="canDisplayPayPalOnBasketPage" value="true">
+{{#each shopping-cart-v2.sections }}
+<section class="basket__section" data-type="{{type}}">
+  {{> checkout-section-title title=type items-count=items-count}}
+  {{#each items}}
+  {{> order-item}}
+  {{/each}}
+</section>
+{{/each}}
+{{> charity-donations-multiple shopping-cart-v2.charityDonationMultiple}}
+{{> checkout-action}}
+{{/content}}
+{{#content "foot" mode="append"}}
+<script defer src="./js/basket.min.js"></script>
+<script defer src="./js/page/components/modal-observer.js"></script>
+{{> billie-modal }}
+{{/content}}
+{{/extend}}