wickes-css2 2.94.0-develop.1 → 2.94.0-develop.12

package/src/scss/libs/flatpickr.scss

@@ -0,0 +1,235 @@
+@import '../helpers/helpers';
+
+.flatpickr-datepicker {
+  margin-top: 16px;
+
+  &__label {
+    font-size: 1rem;
+    font-weight: 500;
+    line-height: 1.5rem;
+    margin-bottom: 8px;
+    display: flex;
+    align-items: center;
+
+    .icon-info {
+      cursor: pointer;
+      margin-left: 8px;
+    }
+
+    .tooltip {
+      filter: drop-shadow(0 0 8px rgba(0, 0, 0, .12));
+      position: absolute;
+
+      .tooltip-inner {
+        background: $white;
+        color: $gray-dark;
+        padding: 8px 16px !important;
+        border-radius: 4px;
+        font-weight: 400;
+        font-size: .75rem;
+        line-height: 1rem;
+      }
+
+      .arrow:before {
+        border-top-color: $white;
+      }
+    }
+  }
+
+  &__field {
+    border-radius: 3px;
+    border: 1px solid $gray;
+    padding: 7px 8px 7px 16px;
+    display: flex;
+    align-items: center;
+    max-width: 100%;
+    position: relative;
+    transition: all .3s;
+
+    &.active,
+    &:hover {
+      border-color: $blue;
+    }
+  }
+
+  .icon-wrap {
+    cursor: pointer;
+    width: 24px;
+    height: 24px;
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+
+    &--cross {
+      cursor: pointer;
+      display: none;
+    }
+
+    & + .icon-wrap {
+      margin-left: 8px;
+    }
+  }
+
+  .icon-calendar {
+    font-size: 1rem;
+    color: $blue;
+  }
+
+  .flatpickr {
+    &-input {
+      padding: 0;
+      border: none;
+      font-size: 1rem;
+      font-weight: 400;
+      line-height: 1.5rem;
+      outline: none;
+      width: 100%;
+    }
+
+    &-calendar {
+      &:before,
+      &:after {
+        content: none;
+      }
+
+      &.static {
+        left: 0;
+        width: 100%;
+
+        &.open {
+          margin-top: 4px;
+          padding: 16px;
+          border-radius: 3px;
+          box-shadow: 0 0 15px 0 rgba(0, 0, 0, .20);
+        }
+      }
+    }
+
+    &-monthSelect-months {
+      display: grid;
+      grid-template-columns: 1fr 1fr 1fr;
+      margin: 12px 0 0;
+      grid-gap: 8px;
+      justify-items: center;
+      align-items: center;
+    }
+
+    &-monthSelect-month {
+      margin: 0;
+      width: 100%;
+      font-size: .875rem;
+      font-style: normal;
+      font-weight: 400;
+      line-height: 1.375rem;
+      padding: 4px;
+      border-radius: 999px;
+      max-width: 78px;
+      color: $gray-dark;
+
+      &.selected {
+        background: $blue;
+        border-color: $blue;
+        color: $white;
+
+        &:hover {
+          border-color: $blue;
+          background: $blue;
+          color: $gray-dark;
+        }
+      }
+
+      &:not(.flatpickr-disabled):hover {
+        border-color: $blue;
+        background: transparent;
+      }
+
+      &.flatpickr-disabled {
+        color: $gray-wait;
+        pointer-events: none;
+
+        &:hover {
+          border: none;
+        }
+      }
+
+      &.today {
+        border-color: transparent;
+
+        &:hover {
+          border-color: $blue;
+          background: transparent;
+          color: initial;
+        }
+      }
+    }
+
+    &-current-month {
+      padding-top: 0;
+      height: auto;
+
+      input.cur-year {
+        padding-left: 0;
+        font-size: 0.875rem;
+        font-weight: 500;
+        line-height: 1.375rem;
+        text-align: center;
+      }
+    }
+
+    &-prev-month.flatpickr-disabled,
+    &-next-month.flatpickr-disabled {
+      display: block;
+      opacity: .6;
+      pointer-events: none;
+    }
+
+    &-months {
+      .flatpickr-prev-month,
+      .flatpickr-next-month {
+        position: relative;
+        display: flex;
+        align-items: center;
+        height: auto;
+        padding: 0;
+
+        svg path {
+          fill: $blue;
+        }
+      }
+
+      .flatpickr-month {
+        height: 100%;
+
+        .flatpickr-current-month {
+          width: 100%;
+          left: auto;
+          position: relative;
+        }
+      }
+    }
+
+    &-current-month {
+      .numInputWrapper {
+        &:hover {
+          background: transparent;
+        }
+
+        .arrowUp,
+        .arrowDown {
+          content: none;
+          display: none;
+        }
+      }
+    }
+
+    &-wrapper {
+      flex: 1;
+      position: initial;
+      width: 100%;
+    }
+
+    &-rContainer {
+      width: 100%;
+    }
+  }
+}

package/src/scss/pages/_my-account_new.scss

@@ -638,10 +638,6 @@
     align-items: center;
     padding: 17px 0 15px 10px;
 
-    &__act {
-      display: none;
-    }
-
     &__info {
       align-self: flex-start;
     }
@@ -759,7 +755,6 @@
       margin-bottom: 15px;
 
       .store {
-        &__act,
         &__count {
           display: none;
         }
@@ -860,12 +855,6 @@
 
     .stock__store {
       padding-bottom: 40px;
-
-      .store__act {
-        padding-top: 7px;
-        position: absolute;
-        color: $blue;
-      }
     }
 
     .stock__tabs {
@@ -1117,7 +1106,7 @@
     }
 
     &_cell {
-      border: 2px solid $gray-light;
+      border: 1px solid $gray-light;
 
       &:nth-child(2n+1) {
         padding-left: 20px;

package/src/scss/pages/my-account-v2.scss

@@ -1,10 +1,10 @@
 @import '../helpers/helpers';
 @import '../components/my-account/consignment-info';
 @import '../components/my-account/shipment';
-@import '../components/my-account/order';
 @import '../components/my-account/menu';
 @import '../components/my-account/contacts';
 @import '../components/my-account/mobile-nav';
+@import '../components/my-account/active-orders';
 
 .my-account {
   margin: 0;
@@ -265,81 +265,6 @@
       margin-bottom: 0;
     }
   }
-
-  .active-orders {
-    margin-top: 24px;
-
-    &__title {
-      font-weight: 500;
-      font-size: 1.25rem;
-      line-height: 1rem;
-      color: $blue-dark;
-      margin-bottom: 0;
-    }
-
-    &__item {
-      margin-top: 16px;
-      padding: 16px;
-      background: $white;
-      border-radius: 4px;
-
-      & + & {
-        margin-top: 16px;
-      }
-    }
-
-    .view-more {
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      padding-top: 12px;
-      border-top: 1px solid $gray;
-
-      .link {
-        font-weight: 500;
-        font-size: .875rem;
-        line-height: 1.375rem;
-        text-align: center;
-        color: $blue;
-        text-decoration: none;
-        display: flex;
-        justify-content: center;
-        align-items: center;
-
-        span:hover {
-          text-decoration: underline;
-        }
-
-        .icon {
-          margin-left: 8px;
-          font-size: 1rem;
-        }
-      }
-    }
-
-    .btn--all-orders {
-      margin-top: 16px;
-    }
-
-    .tooltip {
-      filter: drop-shadow(0 0 8px rgba(0, 0, 0, .12));
-      position: absolute;
-
-      .tooltip-inner {
-        background: $white;
-        color: $gray-dark;
-        padding: 8px 16px !important;
-        border-radius: 4px;
-        font-weight: 400;
-        font-size: .75rem;
-        line-height: 1rem;
-      }
-
-      .arrow:before {
-        border-top-color: $white;
-      }
-    }
-  }
 }
 
 @include media-breakpoint-up(sm) {
@@ -395,50 +320,6 @@
       }
     }
 
-    .active-orders {
-      &__header {
-        display: flex;
-        justify-content: space-between;
-        align-items: center;
-
-        .btn--all-orders {
-          margin-top: 0;
-          max-width: 125px;
-        }
-      }
-
-      &__item {
-        display: grid;
-        grid-template-areas:
-        'header viewMore'
-        'orderDetails orderDetails'
-        'consignmentInfo consignmentInfo'
-        'shipment shipment';
-
-        .order-header {
-          flex-direction: row-reverse;
-          justify-content: flex-end;
-          grid-area: header;
-
-          &__title {
-            margin-left: 16px;
-            font-weight: 700;
-          }
-        }
-
-        .view-more {
-          grid-area: viewMore;
-          justify-content: flex-end;
-          border-top: 0;
-          padding: 0;
-
-          .link .icon {
-            margin-left: 13px;
-          }
-        }
-      }
-    }
-
     .notification_info-message {
       font-size: .875rem;
     }
@@ -456,10 +337,6 @@
       padding: 24px;
     }
 
-    .active-orders__title {
-      font-size: 1.5rem;
-    }
-
     .notification_general:not(.notification_info-message) {
       margin-top: 16px;
       margin-bottom: 16px;
@@ -530,18 +407,6 @@
     .clipboard-code.discount-code {
       padding-right: 14px;
     }
-
-    .active-orders {
-      &__item {
-        padding: 24px;
-        grid-template-areas:
-        'header consignmentInfo viewMore'
-        'orderDetails orderDetails orderDetails'
-        'shipment shipment shipment';
-        grid-template-columns: auto auto 1fr;
-        align-items: center;
-      }
-    }
   }
 }