wickes-css2 2.96.0-develop.3 → 2.96.0-develop.4

package/src/scss/components/_back-to-top.scss

@@ -33,6 +33,38 @@
       height: auto;
     }
   }
+
+  body:has(.summary__aside) & {
+    bottom: 193px !important;
+
+    &.single-button {
+      bottom: 141px !important;
+    }
+  }
+
+  body.summary-hidden & {
+    bottom: 16px !important;
+    right: 16px !important;
+  }
+}
+
+@include media-breakpoint-up(sm) {
+  .back-to-top {
+    body:has(.summary__aside) & {
+      bottom: 198px !important;
+
+      &.single-button {
+        bottom: 146px !important;
+      }
+    }
+
+    // Required to resolve a specificity tie. By coming last, this 'hidden'
+    // state correctly overrides the ':has' state above.
+    body.summary-hidden & {
+      bottom: 16px !important;
+      right: 16px !important;
+    }
+  }
 }
 
 @include media-breakpoint-up(lg) {
@@ -43,5 +75,18 @@
     &--with-chat {
       bottom: 120px !important;
     }
+
+    body:has(.summary__aside):not(.summary-hidden) & {
+      &,
+      &.single-button {
+        right: 48px !important;
+        bottom: 24px !important;
+      }
+    }
+
+    body.summary-hidden & {
+      right: 48px !important;
+      bottom: 24px !important;
+    }
   }
 }

package/src/scss/components/_order-summary.scss

@@ -3,11 +3,6 @@
 $android-offset:   60px !default;
 $ios-notch-offset: 80px !default;
 
-body.summary-hidden .back-to-top {
-  bottom: 20px !important;
-  right: 16px !important;
-}
-
 .summary {
   &__aside {
     padding: 15px;
@@ -294,14 +289,6 @@ body.summary-hidden .back-to-top {
   transition: transform .3s ease;
 }
 
-.back-to-top {
-  bottom: 193px !important;
-}
-
-.back-to-top.single-button {
-  bottom: 141px !important;
-}
-
 .summary:not(.summary--mobile) {
   .summary__aside {
     padding: 20px 20px 0;
@@ -330,14 +317,6 @@ body.summary-hidden .back-to-top {
       }
     }
   }
-
-  .back-to-top {
-    bottom: 198px !important;
-  }
-
-  .back-to-top.single-button {
-    bottom: 146px !important;
-  }
 }
 
 @include media-breakpoint-up(md) {
@@ -421,16 +400,6 @@ body.summary-hidden .back-to-top {
     box-shadow: none;
   }
 
-  .back-to-top {
-    right: 48px !important;
-    bottom: 24px !important;
-  }
-
-  .back-to-top.single-button {
-    right: 48px !important;
-    bottom: 24px !important;
-  }
-
   .basket {
     .summary {
       & .summary__payment {

package/src/scss/components/_sticky-element-appearance.scss

@@ -7,7 +7,7 @@
   opacity: 0;
   pointer-events: none;
   will-change: transform, opacity;
-  transition: transform 0.5s ease, opacity 0.5s ease;
+  transition: transform .5s ease, opacity .5s ease;
 
   &:not(.is-hidden) {
     transform: translateY(0);
@@ -18,8 +18,7 @@
   &.is-hidden {
     transform: translateY(100%);
     opacity: 0;
-    transition: transform 0.5s ease 0s,
-    opacity   0.5s ease 5s;
+    transition: transform .5s ease 0s, opacity .5s ease 5s;
     pointer-events: none;
   }
 }

package/src/scss/partials/_main-nav.scss

@@ -215,11 +215,6 @@
     opacity: 0;
     animation: fade-in .5s ease-in-out forwards;
 
-    .main-nav[data-ssr='true'] &:not(.slide-in):not(.slide-in-l2r) {
-      opacity: 1;
-      animation: none;
-    } 
-
     &_order-line {
       color: $blue;
     }
@@ -952,10 +947,6 @@
       padding: 0;
       gap: 30px;
 
-      &-banner {
-        display: none;
-      }
-
       &__label {
         margin-bottom: 10px;
         padding: 0 10px;

package/src/sitemap.html

@@ -921,17 +921,6 @@
                             </a>
                         </li>
                     </ul>
-                    <h3>
-                        Old Navigation
-                    </h3>
-                    <ul>
-                        <li>
-                            <span class="page-id">1</span>
-                            <a href="page_old-navigation.html" target="_blank">
-                                Page with old navigation
-                            </a>
-                        </li>
-                    </ul>
                 </div>
                 <div class="col">
                     <h3>Basket</h3>

package/src/components/navigation/menu-item-sub.hbs

@@ -1,33 +0,0 @@
-<ul>
-  {{#each subMenuItems}}
-    <li class="main-nav__sub-menu__item nav-col">
-      <a 
-        href="{{ url }}" 
-        class="main-nav__sub-menu__link main-nav__sub-sub-menu__link-last 
-          {{#if color}}main-nav__sub-menu__link--invert {{/if}}
-          {{#ifCond color '==' "GREEN"}}green{{/ifCond}}
-          {{#ifCond color '==' "RED"}}red{{/ifCond}}
-        " 
-        tabindex="0"
-        style="
-          {{#ifCond color '==' "GREEN"}}background-color: #9acd32; color: #fff;{{/ifCond}}
-          {{#ifCond color '==' "RED"}}background-color: #cf000f; color: #fff;{{/ifCond}}
-          {{#if bold}}font-weight: 700;{{/if}}
-        "
-      >
-        {{ name }}
-      </a>
-    </li>
-  {{/each }}
-  {{#if originalChildrenCount}}
-    {{#ifCond originalChildrenCount '!=' subMenuItems.length }}
-      <a 
-      href="{{ menuItemUrl }}" 
-      class="main-nav__sub-menu__link main-nav__sub-menu__view-more main-nav__sub-sub-menu__link-last" 
-      tabindex="0"
-    >
-      View More
-    </a>
-    {{/ifCond}}
-  {{/if}}
-</ul>

package/src/components/navigation/menu-item-top.hbs

@@ -1,32 +0,0 @@
-{{#each navigation}}
-<ul class="main-nav__top-level">
-  {{#each children}}
-    <li class="main-nav__top-level__item">
-      <a 
-        href="{{ url }}" 
-        class="main-nav__top-level__label 
-          {{#if color}}main-nav__top-level__label--invert {{/if}}
-          {{#ifCond color '==' "GREEN"}}green{{/ifCond}}
-          {{#ifCond color '==' "RED"}}red{{/ifCond}}
-        " 
-        tabindex="0" 
-        style="
-          {{#ifCond color '==' "GREEN"}}background-color: #9acd32; color: #fff;{{/ifCond}}
-          {{#ifCond color '==' "RED"}}background-color: #cf000f; color: #fff;{{/ifCond}}
-          {{#if bold}}font-weight: 700;{{/if}}
-        "
-      >
-        {{ name }}
-      </a>
-      <div class="main-nav__menu-wrapper">
-        {{#if banner}}
-          <div class="main-nav__menu-banner">
-            {{{banner}}}
-          </div>
-        {{/if}}
-        {{> navigation/menu-item menuItems=children}}
-      </div>
-    </li>
-  {{/each}}
-</ul>
-{{/each}}

package/src/components/navigation/menu-item.hbs

@@ -1,32 +0,0 @@
-<ul class="main-nav__menu">
-  {{#each menuItems}}
-  <li class="main-nav__menu__item nav-col">
-    <a 
-      href="{{ url }}" 
-      class="main-nav__menu__label 
-        {{#if color}}main-nav__menu__label--invert {{/if}}
-        {{#ifCond color '==' "GREEN"}}green{{/ifCond}}
-        {{#ifCond color '==' "RED"}}red{{/ifCond}}
-      "
-      tabindex="0"
-      style="
-        {{#ifCond color '==' "GREEN"}}background-color: #9acd32; color: #fff;{{/ifCond}}
-        {{#ifCond color '==' "RED"}}background-color: #cf000f; color: #fff;{{/ifCond}}
-        {{#if bold}}font-weight: 700;{{/if}}
-      "
-    >
-      {{ name }}
-    </a>
-    <div class="main-nav__sub-menu__wrapper" tabindex="0">
-      <div class="main-nav__sub-menu">
-        {{> navigation/menu-item-sub subMenuItems=children originalChildrenCount=originalChildrenCount menuItemUrl=url}}
-        <div class="main-nav__view-all">
-          <a href="{{ url }}" class="main-nav__view-all__link" tabindex="0">
-            View all {{ name }}
-          </a>
-        </div>
-      </div>
-    </div>
-  </li>
-  {{/each}}
-</ul>

package/src/components/navigation/nav-wrapper.hbs

@@ -1,12 +0,0 @@
-<div class="main-nav__section main-nav__section_main">
-  <div class="main-nav__back-btn__wrap">
-    <a href="#" class="main-nav__back-btn">
-      <span class="icon">
-        <i class="fas fa-arrow-left fa-lg"></i>
-      </span>
-    </a>
-  </div>
-  <div class="main-nav__top-level-wrap">
-    {{> navigation/menu-item-top }}
-  </div>
-</div>