luna-one 3.1.593 → 3.1.594

package/dist/luna/components/MobileNav/MobileNav.scss

@@ -1,286 +1,286 @@
-@import "../../../global-styles/terra.scss";
-
-.ter-mobile-nav {
-  position: absolute;
-  top: 60px;
-  width: 100vw;
-  z-index: 100;
-  white-space: nowrap;
-  color: $trimble-dark-gray;
-  transition: 0.3s;
-  overflow: scroll;
-  overflow-x: hidden;
-  height: 0vh;
-  visibility: hidden;
-
-  &--is-open {
-    visibility: visible;
-    height: 100vh;
-    background: $white;
-
-    @media screen and (min-width: $breakpoint-sm) {
-      display: none;
-    }
-  }
-
-  &__menus-container {
-    font-size: $eyebrow-font-size;
-
-    li {
-      text-decoration: none;
-      list-style: none;
-      border-bottom: 1px solid $steel-gray;
-      padding: 0px;
-    }
-
-    &--fill {
-      position: absolute;
-      top: 0;
-      background: $trimble-blue;
-      width: 100vw;
-      height: 60px;
-      transition: 0s;
-      transition-delay: 0.3s;
-
-      &--hidden {
-        width: 0vw;
-        transition-delay: 0s;
-      }
-    }
-    &--no-fill {
-      position: absolute;
-      top: 0;
-      background: none;
-      width: 100vw;
-      height: 60px;
-      transition: 0s;
-      transition-delay: 0.3s;
-
-      &--hidden {
-        width: 0vw;
-        transition-delay: 0s;
-      }
-    }
-  }
-
-  &__link {
-    text-decoration: none;
-    visibility: visible;
-    display: block;
-    transition: 0.3s;
-    transform: translateX(0%);
-
-    &--hidden {
-      visibility: hidden;
-      transform: translateX(-100%);
-    }
-
-    p {
-      font-size: $body-font-size;
-      margin: 0;
-      height: 60px;
-      line-height: 60px;
-      background: $trimble-blue;
-      color: $white;
-      padding: 0 16px;
-      @include benton-medium();
-      border-bottom: solid 1px $white;
-      overflow: hidden;
-    }
-
-    &:focus p {
-      transition: 0s;
-      outline: 2px solid $trimble-gold;
-      outline-offset: -2px;
-    }
-  }
-
-  &__flyout {
-    &--active {
-      display: flex;
-      flex-direction: column;
-    }
-
-    &--regular-padding {
-      padding-bottom: 60px;
-    }
-
-    &--extra-padding {
-      padding-bottom: 170px;
-    }
-
-    &-wrapper {
-      display: flex;
-      flex-direction: row;
-      justify-content: space-between;
-      align-items: center;
-      height: 80px;
-      cursor: pointer;
-      padding-left: 16px;
-      transform: translateX(0%);
-      transition: 0.3s;
-
-      &--inactive {
-        visibility: hidden;
-        transform: translateX(-100%);
-      }
-    }
-
-    &-title {
-      display: flex;
-      flex-direction: row;
-      align-items: center;
-
-      &-text {
-        font-size: $body-font-size;
-        color: $trimble-blue;
-        @include benton-medium();
-        margin-right: 11px;
-      }
-
-      &-icon {
-        width: 10px;
-      }
-    }
-
-    &-logo {
-      background: #0063a3;
-      width: 80px;
-      height: 80px;
-      display: flex;
-      justify-content: center;
-      align-items: center;
-
-      img {
-        width: 37px;
-        height: 40px;
-      }
-    }
-  }
-}
-
-.ter-top-mobile-nav {
-  padding: 16px;
-
-  &__location-wrapper {
-    display: flex;
-    align-items: center;
-    height: 60px;
-    border-bottom: 1px solid $trimble-blue;
-    padding: 0 16px;
-    cursor: pointer;
-    transform: translateX(0%);
-    transition: 0.3s;
-    visibility: visible;
-    overflow: hidden;
-    background: $white;
-    &--inactive {
-      visibility: hidden;
-      transform: translateX(-100%);
-    }
-
-    &--hidden {
-      visibility: hidden;
-      transform: translateX(0%);
-    }
-  }
-
-  &__login-wrapper {
-    display: flex;
-    align-items: center;
-    padding: 0 16px;
-    transform: translateX(0%);
-    transition: 0.3s;
-    visibility: visible;
-    overflow: hidden;
-    background: $white;
-    &--inactive {
-      visibility: hidden;
-      transform: translateX(-100%);
-    }
-
-    &--hidden {
-      visibility: hidden;
-      transform: translateX(0%);
-    }
-  }
-
-  &__location {
-    font-size: $body-font-size;
-    padding-right: 9px;
-    transform: translateY(-1px);
-    margin: 0px;
-    padding: 0 8px;
-
-    color: $trimble-blue;
-    @include benton-medium();
-  }
-
-  &__globe-icon {
-    width: 16px;
-    transform: translateY(-2px);
-  }
-
-  &__search-wrapper {
-    display: grid;
-    grid-template-columns: 1fr 22px;
-    margin-top: 28px;
-  }
-
-  &__search-field {
-    border: solid 1px $trimble-dark-gray;
-    height: 37px;
-
-    &:focus {
-      outline: none;
-    }
-  }
-
-  &__search-submit {
-    margin: 0;
-    padding: 0;
-  }
-
-  &__search-icon {
-    width: 14px;
-    display: block;
-
-    padding: 12px;
-    box-sizing: content-box;
-  }
-
-  &__link-wrapper {
-    display: flex;
-    justify-content: flex-start;
-    align-items: center;
-    width: 100%;
-    height: 60px;
-    border-bottom: 1px solid $trimble-blue;
-    padding: 0 16px;
-    visibility: visible;
-    transition: 0.3s;
-    transform: translateX(0%);
-    overflow: hidden;
-    background: $white;
-    &--inactive {
-      visibility: hidden;
-      transform: translateX(-100%);
-    }
-
-    &--hidden {
-      visibility: hidden;
-      transform: translateX(0%);
-    }
-  }
-
-  &__link {
-    font-size: $body-font-size;
-    color: $trimble-blue !important;
-    @include benton-medium();
-    text-decoration: none !important;
-  }
-
-  &__link.tabFocus.active:focus {
-    outline: 2px solid $sky-blue;
-  }
-}
+@import "../../../global-styles/terra.scss";
+
+.ter-mobile-nav {
+  position: absolute;
+  top: 60px;
+  width: 100vw;
+  z-index: 100;
+  white-space: nowrap;
+  color: $trimble-dark-gray;
+  transition: 0.3s;
+  overflow: scroll;
+  overflow-x: hidden;
+  height: 0vh;
+  visibility: hidden;
+
+  &--is-open {
+    visibility: visible;
+    height: 100vh;
+    background: $white;
+
+    @media screen and (min-width: $breakpoint-sm) {
+      display: none;
+    }
+  }
+
+  &__menus-container {
+    font-size: $eyebrow-font-size;
+
+    li {
+      text-decoration: none;
+      list-style: none;
+      border-bottom: 1px solid $steel-gray;
+      padding: 0px;
+    }
+
+    &--fill {
+      position: absolute;
+      top: 0;
+      background: $trimble-blue;
+      width: 100vw;
+      height: 60px;
+      transition: 0s;
+      transition-delay: 0.3s;
+
+      &--hidden {
+        width: 0vw;
+        transition-delay: 0s;
+      }
+    }
+    &--no-fill {
+      position: absolute;
+      top: 0;
+      background: none;
+      width: 100vw;
+      height: 60px;
+      transition: 0s;
+      transition-delay: 0.3s;
+
+      &--hidden {
+        width: 0vw;
+        transition-delay: 0s;
+      }
+    }
+  }
+
+  &__link {
+    text-decoration: none;
+    visibility: visible;
+    display: block;
+    transition: 0.3s;
+    transform: translateX(0%);
+
+    &--hidden {
+      visibility: hidden;
+      transform: translateX(-100%);
+    }
+
+    p {
+      font-size: $body-font-size;
+      margin: 0;
+      height: 60px;
+      line-height: 60px;
+      background: $trimble-blue;
+      color: $white;
+      padding: 0 16px;
+      @include benton-medium();
+      border-bottom: solid 1px $white;
+      overflow: hidden;
+    }
+
+    &:focus p {
+      transition: 0s;
+      outline: 2px solid $trimble-gold;
+      outline-offset: -2px;
+    }
+  }
+
+  &__flyout {
+    &--active {
+      display: flex;
+      flex-direction: column;
+    }
+
+    &--regular-padding {
+      padding-bottom: 60px;
+    }
+
+    &--extra-padding {
+      padding-bottom: 170px;
+    }
+
+    &-wrapper {
+      display: flex;
+      flex-direction: row;
+      justify-content: space-between;
+      align-items: center;
+      height: 80px;
+      cursor: pointer;
+      padding-left: 16px;
+      transform: translateX(0%);
+      transition: 0.3s;
+
+      &--inactive {
+        visibility: hidden;
+        transform: translateX(-100%);
+      }
+    }
+
+    &-title {
+      display: flex;
+      flex-direction: row;
+      align-items: center;
+
+      &-text {
+        font-size: $body-font-size;
+        color: $trimble-blue;
+        @include benton-medium();
+        margin-right: 11px;
+      }
+
+      &-icon {
+        width: 10px;
+      }
+    }
+
+    &-logo {
+      background: #0063a3;
+      width: 80px;
+      height: 80px;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+
+      img {
+        width: 37px;
+        height: 40px;
+      }
+    }
+  }
+}
+
+.ter-top-mobile-nav {
+  padding: 16px;
+
+  &__location-wrapper {
+    display: flex;
+    align-items: center;
+    height: 60px;
+    border-bottom: 1px solid $trimble-blue;
+    padding: 0 16px;
+    cursor: pointer;
+    transform: translateX(0%);
+    transition: 0.3s;
+    visibility: visible;
+    overflow: hidden;
+    background: $white;
+    &--inactive {
+      visibility: hidden;
+      transform: translateX(-100%);
+    }
+
+    &--hidden {
+      visibility: hidden;
+      transform: translateX(0%);
+    }
+  }
+
+  &__login-wrapper {
+    display: flex;
+    align-items: center;
+    padding: 0 16px;
+    transform: translateX(0%);
+    transition: 0.3s;
+    visibility: visible;
+    overflow: hidden;
+    background: $white;
+    &--inactive {
+      visibility: hidden;
+      transform: translateX(-100%);
+    }
+
+    &--hidden {
+      visibility: hidden;
+      transform: translateX(0%);
+    }
+  }
+
+  &__location {
+    font-size: $body-font-size;
+    padding-right: 9px;
+    transform: translateY(-1px);
+    margin: 0px;
+    padding: 0 8px;
+
+    color: $trimble-blue;
+    @include benton-medium();
+  }
+
+  &__globe-icon {
+    width: 16px;
+    transform: translateY(-2px);
+  }
+
+  &__search-wrapper {
+    display: grid;
+    grid-template-columns: 1fr 22px;
+    margin-top: 28px;
+  }
+
+  &__search-field {
+    border: solid 1px $trimble-dark-gray;
+    height: 37px;
+
+    &:focus {
+      outline: none;
+    }
+  }
+
+  &__search-submit {
+    margin: 0;
+    padding: 0;
+  }
+
+  &__search-icon {
+    width: 14px;
+    display: block;
+
+    padding: 12px;
+    box-sizing: content-box;
+  }
+
+  &__link-wrapper {
+    display: flex;
+    justify-content: flex-start;
+    align-items: center;
+    width: 100%;
+    height: 60px;
+    border-bottom: 1px solid $trimble-blue;
+    padding: 0 16px;
+    visibility: visible;
+    transition: 0.3s;
+    transform: translateX(0%);
+    overflow: hidden;
+    background: $white;
+    &--inactive {
+      visibility: hidden;
+      transform: translateX(-100%);
+    }
+
+    &--hidden {
+      visibility: hidden;
+      transform: translateX(0%);
+    }
+  }
+
+  &__link {
+    font-size: $body-font-size;
+    color: $trimble-blue !important;
+    @include benton-medium();
+    text-decoration: none !important;
+  }
+
+  &__link.tabFocus.active:focus {
+    outline: 2px solid $sky-blue;
+  }
+}