wickes-css2 2.96.0-develop.6 → 2.96.0-develop.7

package/src/sitemap.html

@@ -644,6 +644,10 @@
                             <span class="page-id">10.1</span>
                             <a href="page_activate-trade-pro.html" target="_blank">Activate Trade Pro account</a>
                         </li>
+                        <li>
+                            <span class="page-id">10.1.1</span>
+                            <a href="page_activate-trade-pro-api-flow.html" target="_blank">Activate Trade Pro account API flow</a>
+                        </li>
                         <li>
                             <span class="page-id">10.2</span>
                             <a href="page_tradePro-checkout-summary.html" target="_blank">TradePro Checkout Summary</a>

package/src/components/ti-header.hbs

@@ -1,34 +0,0 @@
-<header class="ti__header {{headerClass}}">
-    <h3>
-        {{#if number}}
-            <span class="ti__header-number">
-                {{number}}
-            </span>
-        {{/if}}
-        {{#if title}}
-            <span class="ti__header-title">
-                {{title}}
-            </span>
-        {{/if}}
-        {{#if hint}}
-            <span class="ti__header-hint">
-                (in square
-                <span class="ti__header-unit">
-                       meters
-                </span>
-                 -
-                {{#if flooring}}
-                    <span><span class="ti-unit_big">m</span><sup>2</sup></span>
-                {{else}}
-                    <span>SQ<span class="ti-unit_big">M</span></span>
-                {{/if}}
-                )
-            </span>
-        {{/if}}
-    </h3>
-    {{#if linkClass}}
-        <a href="#" class="{{linkClass}}">
-            View/Edit
-        </a>
-    {{/if}}
-</header>

package/src/components/ti-radio.hbs

@@ -1,57 +0,0 @@
-<div class="choose {{class}}">
-  {{#each step}}
-    {{> radiobutton
-            name=radioName
-            id=radioID
-            label=radioLabel
-            class=radioClass}}
-    {{#if additionalBlock}}
-      <div class="form-details">
-        <div class="form-details__row">
-          <div class="form-details__info">
-            Simply complete your details below and click "Continue".
-          </div>
-          <div class="form-details__descr">
-            <div class="warning-required">Required fields</div>
-          </div>
-        </div>
-
-        <div class="form-row" data-row-required>
-          <label class="form-row__label form-row__label_required" for="first-name">Your name:</label>
-          <div class="form-row__field">
-            <input type="text" class="tbx" id="first-name" name="first-name">
-          </div>
-            <div class="form-row__error">Please enter your name.</div>
-        </div>
-
-        <div class="form-row" data-row-required>
-          <label class="form-row__label form-row__label_required" for="mobile-telephone">Phone number:</label>
-          <div class="form-row__field">
-            <input type="tel" class="tbx" id="mobile-telephone" name="mobile-telephone">
-          </div>
-          <div class="form-row__error">Please enter a valid phone number.</div>
-        </div>
-
-        <div class="form-row" data-row-required>
-          <label class="form-row__label form-row__label_required" for="email">E-mail address:</label>
-          <div class="form-row__field">
-            <input type="email" class="tbx" id="email" name="email">
-          </div>
-          <div class="form-row__error">Please enter a valid email address. For example josmith@domain.com</div>
-        </div>
-      </div>
-    {{/if}}
-  {{/each}}
-    {{#if listTitle}}
-        <p class="choose__info">
-            {{ listTitle }}
-        </p>
-        <ul class="choose__list">
-            {{#each sourse }}
-                <li class="choose__item">
-                    {{label}}
-                </li>
-            {{/each}}
-        </ul>
-    {{/if}}
-</div>

package/src/components/tile-banner.hbs

@@ -1,13 +0,0 @@
-<div class="tile-estimation__banner">
-    <img src="./img/wickes-logo.svg" alt="logo" class="tile-estimation__banner-logo">
-    <div class="tile-estimation__banner-info">
-        <h3 class="tile-estimation__banner-header">
-            Calculate the cost of your complete tiling project
-            with our no-obligation tile estimation tool.
-        </h3>
-        <p class="tile-estimation__banner-text">
-            From your chosen tiles to installation guaranteed by us,
-            we offer a complete tiling service.
-        </p>
-    </div>
-</div>

package/src/components/tile-why-wickes.hbs

@@ -1,32 +0,0 @@
-<div class="why-wickes">
-    <h4 class="why-wickes__header">
-        Why Wickes?
-    </h4>
-    <ul class="why-wickes__list">
-        <li class="why-wickes__item">
-            <i class="fas fa-check-circle why-wickes__bullet"></i>
-            <p class="why-wickes__info">
-                Our approved installer will complete a technical survey prior to installation
-            </p>
-        </li>
-        <li class="why-wickes__item">
-            <i class="fas fa-check-circle why-wickes__bullet"></i>
-            <p class="why-wickes__info">
-                We provide a 2-year guarantee on workmanship
-            </p>
-        </li>
-        <li class="why-wickes__item">
-            <i class="fas fa-check-circle why-wickes__bullet"></i>
-            <p class="why-wickes__info">
-                We dispose of your old tiles in an environmentally-friendly way
-            </p>
-        </li>
-        <li class="why-wickes__item">
-            <i class="fas fa-check-circle why-wickes__bullet"></i>
-            <p class="why-wickes__info">
-                Your installation estimate includes adhesive, plastic trim and standard
-                grout colours to finish your tiling job
-            </p>
-        </li>
-    </ul>
-</div>

package/src/data/data_flooring-installation.json

@@ -1,186 +0,0 @@
-{
-  "flooring-installation": {
-    "step2": {
-      "removalExist": [
-        {
-          "label": "Existing laminate or wooden floor",
-          "id": "removal-exist-yes-lam"
-        },
-        {
-          "label": "Existing glued or tiled floor",
-          "id": "removal-exist-yes-tile"
-        },
-        {
-          "label": "Not needed",
-          "id": "removal-exist-no"
-        }
-      ],
-      "removalWaste": [
-        {
-          "label": "Yes",
-          "id": "removal-waste-yes"
-        },
-        {
-          "label": "No",
-          "id": "removal-waste-no"
-        }
-      ],
-      "leveling": [
-        {
-          "label": "Yes",
-          "id": "leveling-yes"
-        },
-        {
-          "label": "No",
-          "id": "leveling-no"
-        },
-        {
-          "label": "Unsure",
-          "id": "leveling-unsure"
-        }
-      ],
-      "additionLeveling": [
-        {
-          "label": "Wooden floating floor",
-          "id": "wooden"
-        },
-        {
-          "label": "Concrete",
-          "id": "concrete"
-        }
-      ],
-      "threshold": {
-        "radio": [
-          {
-            "label": "Yes",
-            "id": "threshold-yes"
-          },
-          {
-            "label": "No",
-            "id": "threshold-no"
-          }
-        ],
-        "cards": [
-          {
-            "title": "Shimba/Alberto/Salerno Variable Height Threshold Bar - 900mm Shimba / Alberto / Salerno Variable Height Threshold Bar",
-            "src": "https://media.wickes.co.uk/is/image/wickes/W6149_201521_00?id=WFNRV0&fmt=jpg&fit=constrain,1&wid=348&hei=275",
-            "price":  10,
-            "quantity": 1,
-            "badge": "2 for £40",
-            "description": [
-              "Length: 900 mm",
-              "Material: Plastic",
-              "Self Adhesive Base - No Drilling or Nailing required",
-              "Ideal for single door"
-            ]
-          },
-          {
-            "title": "Wickes Carpet To Laminate Joint Trim Silver",
-            "src": "https://media.wickes.co.uk/is/image/wickes/W6149_201521_00?id=WFNRV0&fmt=jpg&fit=constrain,1&wid=348&hei=275",
-            "price":  4.50,
-            "quantity": 1,
-            "description": [
-              "Length: 900 mm",
-              "Material: Metal",
-              "Ideal for single door"
-            ]
-          }
-        ]
-      },
-      "trimming": {
-        "radio": [
-          {
-            "label": "Yes",
-            "id": "trimming-yes"
-          },
-          {
-            "label": "No",
-            "id": "trimming-no"
-          },
-          {
-            "label": "Unsure",
-            "id": "trimming-unsure"
-          }
-        ]
-      },
-      "scotia": {
-        "radio": [
-          {
-            "label": "Yes",
-            "id": "scotia-yes"
-          },
-          {
-            "label": "No",
-            "id": "scotia-no"
-          }
-        ],
-        "cards": [
-          {
-            "title": "Vitrex White Flooring Trim - 2m",
-            "src": "https://media.wickes.co.uk/is/image/wickes/C1875_121198_00?$normal$",
-            "price":  5,
-            "quantity": 1,
-            "quantity-sqm": 25,
-            "description": [
-              "Length: 2m",
-              "Material: MDF",
-              "Simple to fit"
-            ]
-          },
-          {
-            "title": "Shimba/Alberto/Salerno Oak Laminate Flooring Trim - 2m",
-            "src": "https://media.wickes.co.uk/is/image/wickes/C1875_121198_00?$normal$",
-            "price":  6,
-            "quantity": 1,
-            "quantity-sqm": 25,
-            "description": [
-              "Length: 2m",
-              "Material: MDF",
-              "For use with Laminate, Engineered & Solid Wood",
-              "Simple to fit"
-            ]
-          }
-        ]
-      },
-      "underlay": {
-        "radio": [
-          {
-            "label": "Yes",
-            "id": "underlay-yes"
-          },
-          {
-            "label": "No",
-            "id": "underlay-no"
-          }
-        ],
-        "cards": [
-          {
-            "title": "Arbiton PE Foam Flooring Underlay - 15m Pack",
-            "src": "https://media.wickes.co.uk/is/image/wickes/W6149_620801_00?$normal$",
-            "price":  15,
-            "quantity": 2,
-            "quantity-sqm": 25,
-            "badge": "2 for £40",
-            "description": [
-              "Material: Foam",
-              "Suitable for both timber and concrete substrates",
-              "Strong thermal resistance - 0.4 Tog, ideal for cold rooms or flats"
-            ]
-          },
-          {
-            "title": "Wickes Carpet To Laminate Joint Trim Silver",
-            "src": "https://media.wickes.co.uk/is/image/wickes/W6149_620801_00?$normal$",
-            "price":  26,
-            "quantity": 2,
-            "quantity-sqm": 25,
-            "description": [
-              "Material: XPS",
-              "Suitable for both timber and concrete substrates",
-              "High compressive strength up to 90 kpa which is ideal for click systems"
-            ]
-          }
-        ]
-      }
-    }
-  }
-}

package/src/scss/components/_ti-header.scss

@@ -1,43 +0,0 @@
-.ti__header {
-  @include make-col(12);
-  position: relative;
-  padding: 15px 0;
-  border-bottom: 1px solid $gray-light;
-
-  &-inactive .ti__header-number,
-  &-inactive .ti__header-title,
-  &-inactive .ti__header-hint {
-    opacity: .5;
-  }
-
-  & h3 {
-    margin-bottom: 0;
-  }
-
-  &-number {
-    display: block;
-    color: $pewter;
-  }
-
-  &-title {
-    display: block;
-    line-height: 1;
-    margin-top: -2px;
-  }
-
-  &-hint {
-    display: block;
-    color: $pewter;
-    font-size: .875rem;
-    font-weight: 400;
-    line-height: 24px;
-
-    &.ti__header-hint {
-      margin-bottom: -8px;
-    }
-
-    @include media-breakpoint-down(sm) {
-      font-weight: 700;
-    }
-  }
-}

package/src/scss/components/_ti-radio.scss

@@ -1,142 +0,0 @@
-.choose {
-  width: 100%;
-  background: $gray-bg;
-  padding: 20px;
-  height: auto;
-  display: flex;
-  flex-direction: column;
-
-  &__info {
-    padding-top: 10px;
-    padding-left: 34px;
-    font-size: .875rem;
-    font-weight: 700;
-    line-height: 22px;
-    margin-bottom: 0;
-  }
-
-  &__list {
-    padding-left: 50px;
-    list-style-position: outside;
-    margin-bottom: 0;
-  }
-
-  &__item {
-    font-size: .875rem;
-    font-weight: 400;
-    line-height: 24px;
-  }
-
-  &__add {
-    text-align: center;
-
-    .ti__phone {
-      padding: 6px;
-      margin-right: .75rem;
-      border: 1px solid $blue;
-      border-radius: 50%;
-      text-align: center;
-      color: $blue;
-      align-self: center;
-      display: flex;
-    }
-
-    .contact-info {
-      margin: 0;
-
-      a {
-        text-decoration: none;
-
-        &:hover {
-          text-decoration: underline;
-        }
-      }
-    }
-  }
-
-  &__callback {
-    .form-details {
-      display: none;
-
-      &_open {
-        display: block;
-
-        .form-row__error {
-          display: none;
-        }
-      }
-
-      &__info {
-        font-weight: bold;
-      }
-
-      .warning-required {
-        margin-top: 10px;
-        margin-bottom: 20px;
-      }
-    }
-  }
-}
-
-@include media-breakpoint-down(md) {
-  .choose {
-    padding: 15px;
-  }
-}
-
-@include media-breakpoint-down(sm) {
-  .choose {
-    &__callback {
-      & label {
-        padding-bottom: 10px;
-      }
-    }
-
-    &__callback,
-    &__add {
-      height: auto;
-    }
-
-    &__add {
-      .ti__phone {
-        align-self: baseline;
-      }
-
-      .contact-info {
-        text-align: left;
-      }
-    }
-
-    &__info {
-      padding-left: 0;
-    }
-
-    &__list {
-      padding-left: 15px;
-    }
-
-    .form-details {
-      .form-row {
-        padding: 0;
-      }
-    }
-  }
-}
-
-@include media-breakpoint-up(md) {
-  .ti__choose {
-    .choose {
-      &__callback {
-        & label {
-          margin-bottom: .75rem;
-        }
-
-        .form-details {
-          margin-left: 34px;
-          width: 50%;
-          margin-bottom: 25px;
-        }
-      }
-    }
-  }
-}

package/src/scss/components/_tile-banner.scss

@@ -1,141 +0,0 @@
-@import '../helpers/helpers';
-
-.tile-estimation {
-  &__banner {
-    position: relative;
-    width: 100%;
-    height: 240px;
-    background: url('./../img/placeholders/tile-banner-desktop.jpg') no-repeat center center;
-    background-size: cover;
-
-    @include media-breakpoint-only(md) {
-      background-image: url('./../img/placeholders/tile-banner-tablet.jpg');
-      height: 200px;
-    }
-
-    @include media-breakpoint-down(sm) {
-      background-image: url('./../img/placeholders/tile-banner-mobile.jpg');
-      height: 220px;
-    }
-
-    &-logo {
-      height: auto;
-      position: absolute;
-      top: 0;
-
-      @include media-breakpoint-up(lg) {
-        right: 20px;
-        width: 90px;
-      }
-
-      @include media-breakpoint-only(md) {
-        left: 15px;
-        width: 75px;
-      }
-
-      @include media-breakpoint-down(sm) {
-        right: 10px;
-        width: 60px;
-      }
-    }
-
-    &-info {
-      position: relative;
-      left: 20px;
-
-      @include media-breakpoint-up(lg) {
-        max-width: 570px;
-        top: 50px;
-      }
-
-      @include media-breakpoint-only(md) {
-        top: 50%;
-        transform: translateY(-50%);
-        max-width: 360px;
-        left: 15px;
-      }
-
-      @include media-breakpoint-down(sm) {
-        max-width: 170px;
-        top: 50%;
-        transform: translateY(-50%);
-        left: 10px;
-      }
-
-      &::after {
-        content: '';
-        position: absolute;
-        bottom: -20px;
-
-        width: 90px;
-        border-top: 3px solid $blue-dark;
-
-        @include media-breakpoint-up(lg) {
-          left: 50%;
-          transform: translateX(-50%);
-        }
-
-        @include media-breakpoint-only(md) {
-          left: 0;
-        }
-
-        @include media-breakpoint-down(sm) {
-          left: 0;
-          width: 25px;
-          bottom: -15px;
-        }
-      }
-    }
-
-    &-header {
-      text-align: center;
-      font-size: 1.375rem;
-      font-weight: 700;
-      line-height: 32px;
-      margin-bottom: 0;
-
-      @include media-breakpoint-only(md) {
-        text-align: left;
-        max-width: 360px;
-        font-size: 1rem;
-        line-height: 23px;
-      }
-
-      @include media-breakpoint-down(sm) {
-        text-align: left;
-        max-width: 170px;
-        font-size: .875rem;
-        font-weight: 700;
-        line-height: 19px;
-      }
-    }
-
-    &-text {
-      text-align: center;
-      max-width: 430px;
-      font-size: 1.125rem;
-      font-weight: 400;
-      line-height: 24px;
-      margin-bottom: 0;
-
-      @include media-breakpoint-up(lg) {
-        margin: 10px auto 0;
-      }
-
-      @include media-breakpoint-only(md) {
-        margin-top: 5px;
-        text-align: left;
-        max-width: 320px;
-        font-size: $font-size-13;
-      }
-
-      @include media-breakpoint-down(sm) {
-        max-width: 155px;
-        text-align: left;
-        font-size: $font-size-13;
-        font-weight: 400;
-        line-height: 17px;
-      }
-    }
-  }
-}