wickes-css2 2.103.0-gift-cards.15 → 2.103.0-gift-cards.17

package/src/js/components/banner-placement-manager.js

@@ -0,0 +1,267 @@
+var Wick = Wick || {};
+Wick.BannerPlacementManager = {
+  SPONSOR_BANNERS_DISPLAYED_EVENT: 'sponsorAdsDisplayedEvent',
+  el: {
+    banners: '.card-product-banner',
+    sponsorBanners: '.card-sponsor-banner',
+    sponsorProducts: '.card-sponsor-product',
+    allBanners: '.card-product-banner, .card-sponsor-banner, .card-sponsor-product',
+    productCard: '.product-card',
+    allListSlots: '.product-card, .card-product-banner, .card-sponsor-banner, .card-sponsor-product',
+    productsWrap: '.products-list-v2',
+    $products: $('.product-card'),
+    attrPositionDesktop: 'data-desktop-position',
+    attrPositionMobile: 'data-mobile-position',
+    attrRequiredAmountDesktop: 'data-required-amount-desktop',
+    attrRequiredAmountMobile: 'data-required-amount-mobile',
+    hide: 'd-none',
+    sponsoredAdvBanners: '.sponsored-ad'
+  },
+  classes: {
+    sponsorBanners: 'card-sponsor-banner',
+    sponsorProducts: 'card-sponsor-product',
+    productBanners: 'card-product-banner',
+    bannerInactiveClass: 'card-product-banner--inactive'
+  },
+  isEventSent: false,
+  currentBreakpoint: null,
+  checkProductsInColumn() {
+    Wick.BannerPlacementManager.addInactiveClasses();
+    Wick.BannerPlacementManager.arrangeBannersInRightOrder();
+    const $allBanners = $(Wick.BannerPlacementManager.el.allBanners);
+    const totalProducts = Wick.BannerPlacementManager.getListLength();
+    const totalSlots = totalProducts + $allBanners.length;
+    $allBanners.each((index, banner) => {
+      const bannerPosition = Wick.BannerPlacementManager.getBannerPosition(banner);
+
+      if ($(banner).hasClass('card-product-banner')) {
+        if (bannerPosition > totalSlots) {
+          Wick.BannerPlacementManager.hideBanner(banner);
+          $(Wick.BannerPlacementManager.el.productsWrap).append(banner);
+          return;
+        }
+      }
+
+      if ($(banner).hasClass(Wick.BannerPlacementManager.classes.sponsorBanners) || $(banner).hasClass(Wick.BannerPlacementManager.classes.sponsorProducts)) {
+        if (bannerPosition > totalProducts) {
+          Wick.BannerPlacementManager.showBanner(banner);
+          Wick.BannerPlacementManager.removeInactiveClass(banner);
+          $(Wick.BannerPlacementManager.el.productsWrap).append(banner);
+          return;
+        }
+      }
+
+      Wick.BannerPlacementManager.hideBannerDueLimit(banner, index);
+      Wick.BannerPlacementManager.moveBannerToSpecifiedPosition(banner);
+    });
+  },
+  moveBannerToSpecifiedPosition(banner) {
+    const $listSlots = Wick.BannerPlacementManager.getListSlots();
+    const bannerPosition = Wick.BannerPlacementManager.getBannerPosition(banner) - 2;
+    const listSlotsLength = $listSlots.length;
+
+    if (Wick.BannerPlacementManager.isBannerVisible(banner)) {
+      if (bannerPosition <= listSlotsLength) {
+        if ($listSlots[bannerPosition]) {
+          Wick.BannerPlacementManager.showBanner(banner);
+          Wick.BannerPlacementManager.removeInactiveClass(banner);
+          Wick.BannerPlacementManager.moveBanner(banner, $listSlots[bannerPosition]);
+        } else {
+          Wick.BannerPlacementManager.hideBanner(banner);
+          Wick.BannerPlacementManager.coverEdgeCases(banner);
+        }
+      } else {
+        if ($(banner).hasClass(Wick.BannerPlacementManager.classes.sponsorBanners) || $(banner).hasClass(Wick.BannerPlacementManager.classes.sponsorProducts)) {
+          Wick.BannerPlacementManager.showBanner(banner);
+          Wick.BannerPlacementManager.removeInactiveClass(banner);
+          $(Wick.BannerPlacementManager.el.productsWrap).append(banner);
+        } else {
+          Wick.BannerPlacementManager.hideBanner(banner);
+        }
+      }
+    }
+  },
+  moveBanner(banner, targetElement) {
+    $(banner).remove();
+    $(targetElement).after(banner);
+  },
+  hideBanner(banner) {
+    $(banner).addClass(Wick.BannerPlacementManager.el.hide);
+  },
+  showBanner(banner) {
+    $(banner).removeClass(Wick.BannerPlacementManager.el.hide);
+  },
+  isBannerVisible(banner) {
+    return !$(banner).hasClass(Wick.BannerPlacementManager.el.hide);
+  },
+  hideBannerDueLimit(banner) {
+    const bannerMinLimit = Wick.BannerPlacementManager.getBannerLimit(banner) - 1;
+    const $listSlots = Wick.BannerPlacementManager.getListSlots();
+    const listProductsLength = $listSlots.length;
+    Wick.BannerPlacementManager.showBanner(banner);
+
+    if (bannerMinLimit > listProductsLength) {
+      Wick.BannerPlacementManager.hideBanner(banner);
+    }
+  },
+  getBannerPosition(banner) {
+    const isMobile = Wick.BannerPlacementManager.isMobileResolution();
+    const positionAttribute = isMobile
+      ?  Wick.BannerPlacementManager.el.attrPositionMobile
+      : Wick.BannerPlacementManager.el.attrPositionDesktop
+
+    return banner.hasAttribute(positionAttribute)
+      ? Number(banner.getAttribute(positionAttribute))
+      : Number(Wick.BannerPlacementManager.getListLength() + Wick.BannerPlacementManager.getBannersAmount());
+  },
+  getBannerLimit(banner) {
+    const isMobile = Wick.BannerPlacementManager.isMobileResolution();
+
+    const limitAttribute = isMobile
+      ? Wick.BannerPlacementManager.el.attrRequiredAmountMobile
+      : Wick.BannerPlacementManager.el.attrRequiredAmountDesktop;
+
+    return banner.hasAttribute(limitAttribute)
+      ? Number(banner.getAttribute(limitAttribute))
+      : 0;
+  },
+  isMobileResolution() {
+    return Wick.Responsive.getCurrentBreakpoint() !== 'up-lg';
+  },
+  getListLength() {
+    const $listItems = $(Wick.BannerPlacementManager.el.productsWrap).children(Wick.BannerPlacementManager.el.productCard);
+    return $listItems.length;
+  },
+  getBannersAmount() {
+    return $(Wick.BannerPlacementManager.el.allBanners).length;
+  },
+  getProductsAmount() {
+    return Wick.BannerPlacementManager.el.$products.length;
+  },
+  arrangeBannersInRightOrder() {
+    const $allBanners = $(Wick.BannerPlacementManager.el.allBanners);
+
+    const sponsorProducts = $allBanners.filter((i, el) =>
+      $(el).hasClass(Wick.BannerPlacementManager.classes.sponsorProducts)
+    );
+    const sponsorBanners = $allBanners.filter((i, el) =>
+      $(el).hasClass(Wick.BannerPlacementManager.classes.sponsorBanners)
+    );
+
+    const firstSponsorProductPos = sponsorProducts.length > 0
+      ? Math.min(...sponsorProducts.map((i, el) => Wick.BannerPlacementManager.getBannerPosition(el)).get())
+      : Infinity;
+    const firstSponsorBannerPos = sponsorBanners.length > 0
+      ? Math.min(...sponsorBanners.map((i, el) => Wick.BannerPlacementManager.getBannerPosition(el)).get())
+      : Infinity;
+
+    let groupOrder;
+    if (firstSponsorProductPos < firstSponsorBannerPos) {
+      groupOrder = [
+        Wick.BannerPlacementManager.classes.sponsorProducts,
+        Wick.BannerPlacementManager.classes.sponsorBanners,
+        Wick.BannerPlacementManager.classes.productBanners
+      ];
+    } else {
+      groupOrder = [
+        Wick.BannerPlacementManager.classes.sponsorBanners,
+        Wick.BannerPlacementManager.classes.sponsorProducts,
+        Wick.BannerPlacementManager.classes.productBanners
+      ];
+    }
+
+    $allBanners.sort((a, b) => {
+      function getGroupIndex(el) {
+        if ($(el).hasClass(groupOrder[0])) return 0;
+        if ($(el).hasClass(groupOrder[1])) return 1;
+        if ($(el).hasClass(groupOrder[2])) return 2;
+        return 3;
+      }
+
+      const groupA = getGroupIndex(a);
+      const groupB = getGroupIndex(b);
+
+      if (groupA !== groupB) {
+        return groupA - groupB;
+      }
+
+      const positionA = Wick.BannerPlacementManager.getBannerPosition(a);
+      const positionB = Wick.BannerPlacementManager.getBannerPosition(b);
+
+      return positionA - positionB;
+    }).appendTo(Wick.BannerPlacementManager.el.productsWrap);
+  },
+  addInactiveClasses() {
+    $(Wick.BannerPlacementManager.el.allBanners).addClass(Wick.BannerPlacementManager.el.hide);
+  },
+  removeInactiveClass(banner) {
+    $(banner).removeClass(Wick.BannerPlacementManager.classes.bannerInactiveClass)
+  },
+  insertFirstBanner(banner) {
+    const bannerPosition = Wick.BannerPlacementManager.getBannerPosition(banner);
+
+    if (bannerPosition === 1) {
+      Wick.BannerPlacementManager.showBanner(banner);
+      Wick.BannerPlacementManager.removeInactiveClass(banner);
+      $(banner).remove();
+      $(Wick.BannerPlacementManager.el.productsWrap).prepend(banner);
+    }
+  },
+  coverEdgeCases(banner) {
+    Wick.BannerPlacementManager.insertFirstBanner(banner);
+  },
+  getListSlots() {
+    return $(Wick.BannerPlacementManager.el.productsWrap)
+      .children(Wick.BannerPlacementManager.el.allListSlots)
+      .filter(function() {
+        if ($(this).hasClass(Wick.BannerPlacementManager.classes.productBanners)) {
+          const position = Wick.BannerPlacementManager.getBannerPosition(this);
+          const productsCount = Wick.BannerPlacementManager.getListLength();
+          return position <= productsCount;
+        }
+
+        return true;
+      });
+  },
+  getBannerPriority(banner) {
+    if ($(banner).hasClass(Wick.BannerPlacementManager.classes.sponsorProducts)) {
+      return 1;
+    }
+    if ($(banner).hasClass(Wick.BannerPlacementManager.classes.sponsorBanners)) {
+      return 2;
+    }
+    return 3;
+  },
+  dispatchSponsorAdsDisplayedEvent() {
+    return new Promise((resolve, reject) => {
+      const eventDetail = { resolve, reject };
+      const sponsorAdsEvent = createEvent(Wick.BannerPlacementManager.SPONSOR_BANNERS_DISPLAYED_EVENT, { displayed: true }, eventDetail);
+      window.dispatchEvent(sponsorAdsEvent);
+    });
+  },
+  init() {
+    Wick.Responsive.onResize(function () {
+      if(Wick.BannerPlacementManager.currentBreakpoint !== Wick.Responsive.getCurrentBreakpoint()) {
+        Wick.BannerPlacementManager.currentBreakpoint = Wick.Responsive.getCurrentBreakpoint()
+        Wick.BannerPlacementManager.checkProductsInColumn();
+
+        if (
+          !Wick.BannerPlacementManager.isEventSent && $(Wick.BannerPlacementManager.el.sponsoredAdvBanners).length
+        ) {
+          Wick.BannerPlacementManager.dispatchSponsorAdsDisplayedEvent();
+          Wick.BannerPlacementManager.isEventSent = true;
+        }
+
+        $(window).trigger('productBannerPositionChanged');
+      }
+    });
+  }
+};
+
+$(document).ready(function () {
+  if (!Wick.BannerPlacementManager.getBannersAmount() || !Wick.BannerPlacementManager.getProductsAmount()) {
+    return;
+  }
+
+  Wick.BannerPlacementManager.init();
+})

package/src/js/emulation/banner-placement-manager.js

@@ -0,0 +1,53 @@
+// Simulate prompt for input
+function getInputs() {
+  const productBannerPositions = prompt("Enter Product Banner Positions:", "2") || "";
+  const sponsorProductPositions = prompt("Enter Sponsor Product Positions (comma-separated):", "6,7,8") || "";
+  const sponsorBannerPositions = prompt("Enter Sponsor Banner Positions:", "10") || "";
+
+  return {
+    productBannerPositions: productBannerPositions ? productBannerPositions.split(",").map(Number) : [],
+    sponsorProductPositions: sponsorProductPositions ? sponsorProductPositions.split(",").map(Number) : [],
+    sponsorBannerPositions: sponsorBannerPositions ? sponsorBannerPositions.split(",").map(Number) : [],
+  };
+}
+
+function getPositionAttr() {
+  const isMobile = Wick.BannerPlacementManager.isMobileResolution();
+  return isMobile
+    ? 'data-mobile-position'
+    : 'data-desktop-position';
+}
+
+function updatePositions(inputs) {
+  const productBannerElements = document.querySelectorAll(".card-product-banner");
+  productBannerElements.forEach((el, index) => {
+    if (inputs.productBannerPositions[index] !== undefined) {
+      el.setAttribute(getPositionAttr(), inputs.productBannerPositions[index]);
+    }
+  });
+
+  const sponsorProductElements = document.querySelectorAll(".card-sponsor-product");
+  sponsorProductElements.forEach((el, index) => {
+    if (inputs.sponsorProductPositions[index] !== undefined) {
+      el.setAttribute(getPositionAttr(), inputs.sponsorProductPositions[index]);
+    }
+  });
+
+  const sponsorBannerElements = document.querySelectorAll(".card-sponsor-banner");
+  sponsorBannerElements.forEach((el, index) => {
+    if (inputs.sponsorBannerPositions[index] !== undefined) {
+      el.setAttribute(getPositionAttr(), inputs.sponsorBannerPositions[index]);
+    }
+  });
+}
+
+function init() {
+  const inputs = getInputs();
+  updatePositions(inputs);
+}
+
+$(document).ready(function () {
+  if ($('.retail-media .products-list.products-list-v2').length) {
+    setTimeout(() => init(), 100)
+  }
+});

package/src/js/page/plp-cards-v2.js

@@ -6,7 +6,9 @@ $(document).ready(function () {
     }
 
     function cardsContent(itemsInRow) {
-        let card = $('.content .product-card, .content .card-product-banner');
+        let card = $('.content .product-card, .content .card-product-banner, .content .card-sponsor-banner, .content .card-sponsor-product').filter(function() {
+            return $(this).parents('.product-card, .card-product-banner, .card-sponsor-banner, .card-sponsor-product').length === 0;
+        });
         let priceSelectors = [
             '.including-vat .product-card__price__old-price',
             '.excluding-vat .product-card__price__old-price',
@@ -17,6 +19,7 @@ $(document).ready(function () {
         revealAll(card, ['.product-card__price__old-price',
                                     '.product-card__price-sqm',
                                     '.product-card__price-value',
+                                    '.product-card__sponsored',
                                     '.energy-efficiency',
                                     '.energy-efficiency__link']);
 
@@ -33,6 +36,8 @@ $(document).ready(function () {
                 hideEmptiness(currentRow, '.product-card__price-sqm');
             }
             hideEmptiness(currentRow, '.product-card__price-value');
+            hideEmptiness(currentRow, '.product-card__sponsored');
+            hideEmptiness(currentRow, '.product-card__price__old-price');
             hideEmptiness(currentRow, '.energy-efficiency');
             hideEmptiness(currentRow, '.energy-efficiency__link');
 
@@ -43,11 +48,15 @@ $(document).ready(function () {
     function hideEmptiness(query, className) {
         let currentQuery = query.find(className);
         let rowContent = currentQuery.text();
-
-        if (className === '.energy-efficiency') {
-            let isEnergyQueryEmpty = isClassPresentInQuery(currentQuery, "energy-efficiency--empty");
-
-            if (isEnergyQueryEmpty) {
+        const classEmptyCheckMap = {
+            '.energy-efficiency': 'energy-efficiency--empty',
+            '.product-card__sponsored': 'product-card__sponsored--empty',
+            '.product-card__price__old-price': 'product-card__price_empty'
+        };
+
+        if (classEmptyCheckMap[className]) {
+            let isClassEmpty = isClassPresentInQuery(currentQuery, classEmptyCheckMap[className]);
+            if (isClassEmpty) {
                 currentQuery.hide();
             }
             return;

package/src/js/page/plp-load-more.js

@@ -43,7 +43,7 @@ Wick.PLPLoadMore = {
       .finally(() => {
         hideLoader(Wick.PLPLoadMore.el.loader);
         Wick.PLPLoadMore.el.$loadMoreBtn.blur();
-        Wick.ProductBanner.checkProductsInColumn();
+        Wick.BannerPlacementManager.checkProductsInColumn();
         $(window).trigger('productBannerPositionChanged');
         Wick.EnergyEfficiency.drawEnergyLabels();
         Wick.PLP?.bindEvents();

package/src/js/page/utils/gift-cards-utils.js

@@ -32,7 +32,7 @@ export const MESSAGE_BY_CODE = {
   10: 'Gift Card number and / or PIN not recognised. A Gift Card will be locked following three unsuccessful PIN attempts.',
   16: 'Card locked due to three unsuccessful PIN entries. For support click here.',
   20: 'Unable to use Gift Card at this time, please try later or click here for support.',
-  21: 'Unable to use Gift Card at this time, please try later or click here for support.',
+  21: 'Gift Card number not recognised.',
   40: 'Unable to use Gift Card at this time, please try later or click here for support.',
   60: 'The entered Gift Card has expired. For support click here.',
   75: 'The entered Gift Card is invalid. For support click here.',

package/src/page_checkout_payment-details_guest-with-checkout-journey.html

@@ -9,7 +9,7 @@
 {{/content}}
 
 {{#content "aside"}}
-{{> order-summary delivery-address-v2.summary no-action=true id=1 basket-id=true}}
+{{> order-summary delivery-address-v2.summary no-action=true id=1 basket-id=true paymentsCheckoutV2=true}}
 {{/content}}
 
 {{#content "main"}}

package/src/page_my-order.html

@@ -61,7 +61,7 @@
     <div class="col-12 col-lg-3">
       <div class="wismo">
         {{> my-account/wismo_order-summary my_order.wismo-order-summary }}
-        {{> wismo-payment payment-billie=true}}
+        {{> wismo-payment payment-klarna=true}}
       </div>
     </div>
   </div>

package/src/page_payment-details-with-clearpay.html

@@ -1,4 +1,4 @@
-{{#extend "checkout" pageClass="page_checkout-delivery-new page_checkout-confirmation-new page_checkout" title="Checkout - Payment details with Clear Pay" isAsideSticky="true" clearPayIcon=true}}
+{{#extend "checkout" pageClass="page_checkout-delivery-new page_checkout-confirmation-new page_checkout" title="Checkout - Payment details with Clear Pay" isAsideSticky="true" clearPayIcon=true checkout=true}}
 
 {{#content "head" mode="append"}}
 <link type="text/css" rel="stylesheet" href="./css/pages/checkout-new.css">
@@ -16,7 +16,7 @@
 {{/content}}
 
 {{#content "aside"}}
-{{> order-summary delivery-address-v2.summary no-action=true id=1 basket-id=true clearPayIcon=clearPayIcon}}
+{{> order-summary delivery-address-v2.summary no-action=true id=1 basket-id=true clearPayIcon=clearPayIcon paymentsCheckoutV2=true checkout=true}}
 {{/content}}
 
 

package/src/page_plp_v2.html

@@ -1,4 +1,4 @@
-{{#extend "base" hybrisClass="hybris-class" pageClass="products-list-page" title="Products list" globalSearchV2="true" pagePlp=true}}
+{{#extend "base" hybrisClass="hybris-class" pageClass="products-list-page retail-media" title="Products list" globalSearchV2="true" pagePlp=true}}
 {{#content "head" mode="append" pagePlp=true}}
 <link type="text/css" rel="stylesheet" href="./css/components/global-search.css">
 {{/content}}
@@ -32,13 +32,23 @@
                         </div>
 
                         <div class="products-list products-list-v2">
-                            {{#each plp_load-more.results}}
-                            {{>card_product_v2}}
+                            {{#each search-result_v2.products}}
+                                {{>card_product_v2}}
                             {{/each}}
                             {{#if search-result_v2.product-banner}}
-                            {{#each search-result_v2.product-banner}}
-                            {{>card_product_banner_v2}}
-                            {{/each}}
+                                {{#each search-result_v2.product-banner}}
+                                    {{>card_product_banner_v2}}
+                                {{/each}}
+                            {{/if}}
+                            {{#if search-result_v2.sponsor-banner}}
+                                {{#each search-result_v2.sponsor-banner}}
+                                    {{>card_sponsor_banner}}
+                                {{/each}}
+                            {{/if}}
+                            {{#if search-result_v2.sponsor-product}}
+                                {{#each search-result_v2.sponsor-product}}
+                                    {{>card_sponsor_product}}
+                                {{/each}}
                             {{/if}}
                         </div>
                         <div class="load-more-wrap">

package/src/page_search-results.html

@@ -42,9 +42,19 @@
         </div>
 
         <div class="products-list products-list-v2">
-          {{#each plp_energy-efficiency.products}}
-            {{> card_product_v2}}
+          {{#each search-result_v2.products}}
+            {{>card_product_v2}}
           {{/each}}
+          {{#if search-result_v2.sponsor-banner}}
+            {{#each search-result_v2.sponsor-banner}}
+              {{>card_sponsor_banner}}
+            {{/each}}
+          {{/if}}
+          {{#if search-result_v2.sponsor-product}}
+            {{#each search-result_v2.sponsor-product}}
+              {{>card_sponsor_product}}
+            {{/each}}
+          {{/if}}
         </div>
 
         <div class="sort-products-list">

package/src/page_shopping-cart-v2.html

@@ -1,4 +1,4 @@
-{{#extend "basket-new" page_shopping-cart pageClass="page_basket basket" title="Basket" billieIcon=true}}
+{{#extend "basket-new" page_shopping-cart pageClass="page_basket basket" title="Basket" billieIcon=false}}
   {{#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">
@@ -27,7 +27,7 @@
   }}
   {{> checkout-action  mod="mounted"}}
   {{> checkout-action  mod="mounted" view="mobile"}}
-  {{> summary-payment paymentsCheckoutV2=true billieIcon=true}}
+  {{> summary-payment paymentsCheckoutV2=true billieIcon=false}}
 {{/content}}
 {{#content "main"}}
   <input type="hidden" id="SUPPLIER_DELIVERED_7_DAYS" value="<b> Wickes Supplier </b> - Delivery within 7 days">

package/src/scss/components/card-product-banner.scss

@@ -4,7 +4,7 @@
   @include make-col(4);
   margin-bottom: 30px;
 
-  @include media-breakpoint-down(md) { 
+  @include media-breakpoint-down(md) {
     @include make-col(6);
   }
 
@@ -39,7 +39,7 @@
     padding: 0 15px;
 
     @include media-breakpoint-down(sm) {
-      display: inline-block; 
+      display: inline-block;
       padding: 0;
       width: 100%;
     }
@@ -49,4 +49,92 @@
     display: inline-block;
     width: 100%;
   }
-} 
+}
+
+.products-list {
+  .card-sponsor-product,
+  .card-sponsor-banner {
+    @include make-col(4);
+    margin-bottom: 0;
+  }
+
+  .card-sponsor-banner {
+    &__link {
+      display: inline-block;
+      width: 100%;
+      height: 100%;
+      padding: 0 15px;
+    }
+
+    &__image {
+      display: inline-block;
+      width: 100%;
+    }
+  }
+
+  .card-sponsor-product {
+    .product-card {
+      max-width: 100%;
+    }
+  }
+
+  .product-card__sponsored {
+    @include font-size(12);
+    @include line-height(16);
+    color: $squant;
+    font-weight: 400;
+    margin-top: -3px;
+    margin-bottom: 15px;
+    padding: 2px 4px;
+
+    &:not(.product-card__sponsored--empty) {
+      width: max-content;
+      background: $gray-light;
+    }
+  }
+}
+
+@include media-breakpoint-down(md) {
+  .products-list {
+    .card-sponsor-product,
+    .card-sponsor-banner {
+      @include make-col(6);
+
+      .card {
+        max-width: 100%;
+      }
+    }
+  }
+
+  .products-list-v2 {
+    .card-sponsor-product:nth-of-type(n+3) {
+      .card {
+        &:before {
+          content: none;
+        }
+      }
+    }
+  }
+}
+
+@include media-breakpoint-down(sm) {
+  .products-list {
+    .product-card__sponsored {
+      margin-right: auto;
+      margin-left: auto;
+    }
+
+    .card-sponsor-banner {
+      position: relative;
+
+      &::after {
+        content: '';
+        position: absolute;
+        bottom: 20px;
+        left: 5px;
+        width: calc(100% - 10px);
+        border-bottom: 1px solid $gray;
+      }
+    }
+  }
+}

package/src/scss/pages/page_product-details-v2.scss

@@ -143,6 +143,10 @@
       list-style: inherit;
     }
 
+    .share-buttons__list {
+      list-style: none;
+    }
+
     @include media-breakpoint-only(md) {
       padding-top: 35px;
     }

package/src/scss/pages/page_products-list-combined.scss

@@ -47,6 +47,17 @@ $color-bar-radius: 3px;
     }
   }
 
+  .sponsor-top-banner {
+    margin-bottom: 20px;
+    margin-top: 10px;
+
+    &__image {
+      display: block;
+      max-width: 100%;
+      margin-bottom: 20px;
+    }
+  }
+
   .color-pick {
     &__wrap {
       display: none;

package/src/scss/pages/page_products-list.scss

@@ -37,6 +37,14 @@
       }
     }
   }
+
+  .sponsor-top-banner {
+    &__image {
+      margin-bottom: 20px;
+      display: block;
+      max-width: 100%;
+    }
+  }
 }
 
 .products-list {

package/src/sitemap.html

@@ -805,12 +805,6 @@
                                 Klarna TradePro Payment Details
                             </a>
                         </li>
-                        <li>
-                            <span class="page-id">6</span>
-                            <a href="page_split-orders-klarna.html" target="_blank">
-                                Klarna Split Orders
-                            </a>
-                        </li>
                         <li>
                             <span class="page-id">7</span>
                             <a href="page_checkout_confirmation-new-klarna.html" target="_blank">