luna-one 3.1.594 → 3.1.596

package/dist/luna/components/NonTimeBasedListEntries/NonTimeBasedListEntries.scss

@@ -1,340 +1,340 @@
-@import "../../../global-styles/terra.scss";
-
-.non-time-based-list-entries-container {
-  display: flex;
-  font-family: $regular-font-family;
-  color: $trimble-dark-gray;
-
-  .sidebar-image-container {
-    max-width: 320px;
-    min-width: 320px;
-    margin-right: 80px;
-
-    @media (max-width: $breakpoint-sm) {
-      display: none;
-    }
-  }
-
-  .cards {
-    width: 100%;
-    display: flex;
-    flex-direction: column;
-
-    .card {
-      width: 100%;
-      display: block;
-    }
-  }
-
-  .long-description {
-
-    .card{
-      display: flex;
-      justify-content: space-between;
-      padding: $padding-large;
-      border-top: 1px solid $concrete-gray;
-
-      @media (max-width: $breakpoint-xs) {
-        flex-direction: column;
-        padding: $padding-medium 0;
-      }
-
-      &:last-child {
-        padding-bottom: 0;
-      }
-
-      .thumbnail-container {
-        width: 240px;
-        margin-right: 40px;
-
-        @media (max-width: $breakpoint-xs) {
-          width: 160px;
-          margin-right: 0;
-          margin-bottom: 35px;
-        }
-
-        .fallback-image {
-          width: 100%;
-        }
-      }
-
-      .content-container {
-        width: 100%;
-        display: flex;
-        flex-direction: column;
-
-        .header-container {
-          margin-bottom: $padding-small;
-
-          @media (max-width: $breakpoint-xs) {
-            margin-bottom: $padding-medium;
-          }
-
-          .eyebrow {
-            width: 100%;
-            margin-bottom: 16px;
-            font-family: $bold-font-family;
-            font-size: $eyebrow-font-size;
-            font-weight: 700;
-            line-height: 18px;
-
-            @media (max-width: $breakpoint-xs) {
-              font-size: $eyebrow-font-size-mobile;
-              line-height: 19px;
-            }
-          }
-
-          .heading {
-            width: 100%;
-            font-size: $heading-4-size;
-            line-height: 46px;
-
-            @media (max-width: $breakpoint-xs) {
-              font-size: $heading-4-size-mobile;
-              line-height: 35px;
-            }
-          }
-
-          .subtitle {
-            width: 100%;
-            margin-top: 8px;
-            font-family: $medium-font-family;
-            font-size: $body-font-size;
-            line-height: 22px;
-
-            @media (max-width: $breakpoint-xs) {
-              font-size: $body-font-size-mobile;
-              line-height: 23px;
-            }
-          }
-        }
-
-        .body-container {
-          & > * {
-            width: 100%;
-            margin-bottom: 16px;
-            font-size: $body-font-size;
-            line-height: 22px;
-
-            @media (max-width: $breakpoint-xs) {
-              font-size: $body-font-size-mobile;
-              line-height: 23px;
-            }
-
-            &:last-child {
-              margin-bottom: 0;
-            }
-
-            a {
-              color: $trimble-dark-gray;
-              font-family: $medium-font-family;
-              text-decoration: none;
-              line-height: 24px;
-              border-bottom: 2px solid $trimble-gold;
-
-              @media (max-width: $breakpoint-xs) {
-                line-height: 25px;
-              }
-            }
-          }
-        }
-
-        .card-link-container {
-          width: 100%;
-          margin-top: $padding-small;
-
-          .card-link {
-            position: relative;
-            display: inline-block;
-            color: $trimble-dark-gray;
-            font-family: $medium-font-family;
-            text-decoration: none;
-            font-size: $body-font-size;
-            line-height: 14px;
-            border-bottom: 2px solid $trimble-gold;
-
-            &:after {
-              position: absolute;
-              top: -1px;
-              left: calc(100% + 12px);
-              display: block;
-              content: "";
-              width: 16px;
-              height: 16px;
-              background-image: url("../../images/internal-arrow.svg");
-              background-repeat: no-repeat;
-              background-position: center;
-            }
-          }
-          .card-link-external {
-            position: relative;
-            display: inline-block;
-            color: $trimble-dark-gray;
-            font-family: $medium-font-family;
-            text-decoration: none;
-            font-size: $body-font-size;
-            line-height: 14px;
-            border-bottom: 2px solid $trimble-gold;
-
-            &:after {
-              position: absolute;
-              top: -1px;
-              left: calc(100% + 12px);
-              display: block;
-              content: "";
-              width: 16px;
-              height: 16px;
-              background-image: url("../../images/external-arrow.svg");
-              background-repeat: no-repeat;
-              background-position: center;
-            }
-          }
-        }
-      }
-    }
-  }
-
-  .short-description {
-    .cards-group {
-      display: flex;
-      flex-direction: column;
-
-      &:not(:last-child) {
-        margin-bottom: 64px;
-      }
-
-      .group-heading {
-        width: 100%;
-        margin-bottom: 30px;
-        font-family: $very-bold-font-family;
-        font-size: $heading-4-size;
-        line-height: 46px;
-
-        @media (max-width: $breakpoint-xs) {
-          margin-bottom: 9px;
-          font-size: $heading-4-size-mobile;
-          line-height: 32px;
-        }
-
-        & + .card {
-          border-top: 1px solid $trimble-blue;
-        }
-      }
-
-      .card-no-link:hover {
-        background-color: $white !important;
-
-        .heading {
-          border-bottom: 2px solid transparent !important;
-        }
-      }
-
-      .card {
-        width: 100%;
-        padding: $padding-medium;
-        border-top: 1px solid $concrete-gray;
-        text-decoration: none;
-        transition: all 0.3s;
-        color: $trimble-dark-gray;
-
-        @media (max-width: $breakpoint-xs) {
-          padding: $padding-medium 0 $padding-small 0;
-        }
-
-        &:hover {
-          background-color: $concrete-gray-1;
-
-          .heading-container .heading {
-            border-color: $trimble-blue;
-          }
-        }
-
-        .heading-container {
-          width: 100%;
-
-          .heading {
-            position: relative;
-            display: inline-block;
-            font-size: $heading-4-size;
-            line-height: 36px;
-            color: $trimble-blue;
-            border-bottom: 2px solid rgba(255, 255, 255, 0);
-            transition: all 0.3s;
-
-            @media (max-width: $breakpoint-xs) {
-              font-size: $heading-4-size-mobile;
-              line-height: 35px;
-            }
-
-            &.has-link:after {
-              position: absolute;
-              top: 4px;
-              left: calc(100% + 16px);
-              display: block;
-              content: "";
-              width: 32px;
-              height: 32px;
-              background-image: url("../../images/internal-arrow-blue.svg");
-              background-repeat: no-repeat;
-              background-position: center;
-              background-size: 32px;
-
-              @media (max-width: $breakpoint-xs) {
-                width: 24px;
-                height: 24px;
-                background-size: 24px;
-                top: 7px;
-              }
-            }
-            &.has-link-external:after {
-              position: absolute;
-              top: 4px;
-              left: calc(100% + 16px);
-              display: block;
-              content: "";
-              width: 32px;
-              height: 32px;
-              background-image: url("../../images/external-arrow-blue.svg");
-              background-repeat: no-repeat;
-              background-position: center;
-              background-size: 32px;
-
-              @media (max-width: $breakpoint-xs) {
-                width: 24px;
-                height: 24px;
-                background-size: 24px;
-                top: 7px;
-              }
-            }
-
-
-          }
-        }
-
-        .subhead-container {
-          width: 100%;
-          display: flex;
-          flex-wrap: wrap;
-          margin-top: 16px;
-
-          .entry {
-            font-family: $bold-font-family;
-            font-size: 12px;
-            line-height: 18px;
-  
-            &:not(:last-child) {
-              padding-right: 10px;
-              margin-right: 10px;
-              border-right: 1px solid $trimble-dark-gray;
-            }
-  
-            &.industry-category {
-              text-transform: uppercase;
-            }
-          }
-        }
-      }
-    }
-  }
-
+@import "../../../global-styles/terra.scss";
+
+.non-time-based-list-entries-container {
+  display: flex;
+  font-family: $regular-font-family;
+  color: $trimble-dark-gray;
+
+  .sidebar-image-container {
+    max-width: 320px;
+    min-width: 320px;
+    margin-right: 80px;
+
+    @media (max-width: $breakpoint-sm) {
+      display: none;
+    }
+  }
+
+  .cards {
+    width: 100%;
+    display: flex;
+    flex-direction: column;
+
+    .card {
+      width: 100%;
+      display: block;
+    }
+  }
+
+  .long-description {
+
+    .card{
+      display: flex;
+      justify-content: space-between;
+      padding: $padding-large;
+      border-top: 1px solid $concrete-gray;
+
+      @media (max-width: $breakpoint-xs) {
+        flex-direction: column;
+        padding: $padding-medium 0;
+      }
+
+      &:last-child {
+        padding-bottom: 0;
+      }
+
+      .thumbnail-container {
+        width: 240px;
+        margin-right: 40px;
+
+        @media (max-width: $breakpoint-xs) {
+          width: 160px;
+          margin-right: 0;
+          margin-bottom: 35px;
+        }
+
+        .fallback-image {
+          width: 100%;
+        }
+      }
+
+      .content-container {
+        width: 100%;
+        display: flex;
+        flex-direction: column;
+
+        .header-container {
+          margin-bottom: $padding-small;
+
+          @media (max-width: $breakpoint-xs) {
+            margin-bottom: $padding-medium;
+          }
+
+          .eyebrow {
+            width: 100%;
+            margin-bottom: 16px;
+            font-family: $bold-font-family;
+            font-size: $eyebrow-font-size;
+            font-weight: 700;
+            line-height: 18px;
+
+            @media (max-width: $breakpoint-xs) {
+              font-size: $eyebrow-font-size-mobile;
+              line-height: 19px;
+            }
+          }
+
+          .heading {
+            width: 100%;
+            font-size: $heading-4-size;
+            line-height: 46px;
+
+            @media (max-width: $breakpoint-xs) {
+              font-size: $heading-4-size-mobile;
+              line-height: 35px;
+            }
+          }
+
+          .subtitle {
+            width: 100%;
+            margin-top: 8px;
+            font-family: $medium-font-family;
+            font-size: $body-font-size;
+            line-height: 22px;
+
+            @media (max-width: $breakpoint-xs) {
+              font-size: $body-font-size-mobile;
+              line-height: 23px;
+            }
+          }
+        }
+
+        .body-container {
+          & > * {
+            width: 100%;
+            margin-bottom: 16px;
+            font-size: $body-font-size;
+            line-height: 22px;
+
+            @media (max-width: $breakpoint-xs) {
+              font-size: $body-font-size-mobile;
+              line-height: 23px;
+            }
+
+            &:last-child {
+              margin-bottom: 0;
+            }
+
+            a {
+              color: $trimble-dark-gray;
+              font-family: $medium-font-family;
+              text-decoration: none;
+              line-height: 24px;
+              border-bottom: 2px solid $trimble-gold;
+
+              @media (max-width: $breakpoint-xs) {
+                line-height: 25px;
+              }
+            }
+          }
+        }
+
+        .card-link-container {
+          width: 100%;
+          margin-top: $padding-small;
+
+          .card-link {
+            position: relative;
+            display: inline-block;
+            color: $trimble-dark-gray;
+            font-family: $medium-font-family;
+            text-decoration: none;
+            font-size: $body-font-size;
+            line-height: 14px;
+            border-bottom: 2px solid $trimble-gold;
+
+            &:after {
+              position: absolute;
+              top: -1px;
+              left: calc(100% + 12px);
+              display: block;
+              content: "";
+              width: 16px;
+              height: 16px;
+              background-image: url("../../images/internal-arrow.svg");
+              background-repeat: no-repeat;
+              background-position: center;
+            }
+          }
+          .card-link-external {
+            position: relative;
+            display: inline-block;
+            color: $trimble-dark-gray;
+            font-family: $medium-font-family;
+            text-decoration: none;
+            font-size: $body-font-size;
+            line-height: 14px;
+            border-bottom: 2px solid $trimble-gold;
+
+            &:after {
+              position: absolute;
+              top: -1px;
+              left: calc(100% + 12px);
+              display: block;
+              content: "";
+              width: 16px;
+              height: 16px;
+              background-image: url("../../images/external-arrow.svg");
+              background-repeat: no-repeat;
+              background-position: center;
+            }
+          }
+        }
+      }
+    }
+  }
+
+  .short-description {
+    .cards-group {
+      display: flex;
+      flex-direction: column;
+
+      &:not(:last-child) {
+        margin-bottom: 64px;
+      }
+
+      .group-heading {
+        width: 100%;
+        margin-bottom: 30px;
+        font-family: $very-bold-font-family;
+        font-size: $heading-4-size;
+        line-height: 46px;
+
+        @media (max-width: $breakpoint-xs) {
+          margin-bottom: 9px;
+          font-size: $heading-4-size-mobile;
+          line-height: 32px;
+        }
+
+        & + .card {
+          border-top: 1px solid $trimble-blue;
+        }
+      }
+
+      .card-no-link:hover {
+        background-color: $white !important;
+
+        .heading {
+          border-bottom: 2px solid transparent !important;
+        }
+      }
+
+      .card {
+        width: 100%;
+        padding: $padding-medium;
+        border-top: 1px solid $concrete-gray;
+        text-decoration: none;
+        transition: all 0.3s;
+        color: $trimble-dark-gray;
+
+        @media (max-width: $breakpoint-xs) {
+          padding: $padding-medium 0 $padding-small 0;
+        }
+
+        &:hover {
+          background-color: $concrete-gray-1;
+
+          .heading-container .heading {
+            border-color: $trimble-blue;
+          }
+        }
+
+        .heading-container {
+          width: 100%;
+
+          .heading {
+            position: relative;
+            display: inline-block;
+            font-size: $heading-4-size;
+            line-height: 36px;
+            color: $trimble-blue;
+            border-bottom: 2px solid rgba(255, 255, 255, 0);
+            transition: all 0.3s;
+
+            @media (max-width: $breakpoint-xs) {
+              font-size: $heading-4-size-mobile;
+              line-height: 35px;
+            }
+
+            &.has-link:after {
+              position: absolute;
+              top: 4px;
+              left: calc(100% + 16px);
+              display: block;
+              content: "";
+              width: 32px;
+              height: 32px;
+              background-image: url("../../images/internal-arrow-blue.svg");
+              background-repeat: no-repeat;
+              background-position: center;
+              background-size: 32px;
+
+              @media (max-width: $breakpoint-xs) {
+                width: 24px;
+                height: 24px;
+                background-size: 24px;
+                top: 7px;
+              }
+            }
+            &.has-link-external:after {
+              position: absolute;
+              top: 4px;
+              left: calc(100% + 16px);
+              display: block;
+              content: "";
+              width: 32px;
+              height: 32px;
+              background-image: url("../../images/external-arrow-blue.svg");
+              background-repeat: no-repeat;
+              background-position: center;
+              background-size: 32px;
+
+              @media (max-width: $breakpoint-xs) {
+                width: 24px;
+                height: 24px;
+                background-size: 24px;
+                top: 7px;
+              }
+            }
+
+
+          }
+        }
+
+        .subhead-container {
+          width: 100%;
+          display: flex;
+          flex-wrap: wrap;
+          margin-top: 16px;
+
+          .entry {
+            font-family: $bold-font-family;
+            font-size: 12px;
+            line-height: 18px;
+  
+            &:not(:last-child) {
+              padding-right: 10px;
+              margin-right: 10px;
+              border-right: 1px solid $trimble-dark-gray;
+            }
+  
+            &.industry-category {
+              text-transform: uppercase;
+            }
+          }
+        }
+      }
+    }
+  }
+
 }