luna-one 3.1.597 → 3.1.599

package/dist/luna/components/FullBackgroundHero/FullBackgroundHeroDocumentation.mdx

@@ -1,94 +1,94 @@
-#### Full Background Hero
-
-###### Props -
-
-- `content` **(required)** - object containing background images and contents for each variants
-	- `variant` - string to indicate page layout. This defaults to "variant-1"
-	    - `variant-1`       - Full page
-	    - `variant-2`       - Top - Bottom (Right shape)
-	    - `variant-2-inset` - Top - Bottom (Right content)
-	    - `variant-3`       - Top Half
-	- `backgroundImage` - object with `type` as a string and `image` as an object to support component background image. Type can be `image` or `focalPointImage`.
-	- `bottomBackgroundImage` - object with `type` as a string and `image` as an object to support component bottom background image. Type can be `image` or `focalPointImage`.
-	- `leftContent` - react component/dom element to be displayed on the left side of the Hero
-	- `rightContent` - react component/dom element to be displayed on the right side of the Hero
-	- `rightImage` - object with `type` as a string and `image` as an object to support component right image. Type can be `image` or `focalPointImage`.
-	- `shapeType` - string to indicate shape type (`quarter`, `circle`, or `triangle`) to render on the right side.
-	- `shapeBorderColor` - string to indicate the color or the shape image.
-- `theme` - object with `backgroundColor` and `color` as strings to represent hex value for background color.
-- `motion` - boolean to indicate if the content to be displayed with fade animation.
-- `paddingClass` - string to generate a custom class to pass into the outermost div of the component.
-
-###### Example -
-
-```
-const backgroundImage = {
-  type: "focalPointImage",
-  focalPointImage: {
-    x: 2000,
-    y: 2000,
-    title: "union-station-h6",
-    height: 4000,
-    width: 4000,
-    url: "//images.ctfassets.net/citn2sn5tdjr/2nAd2u2LPTRHYP2kyZRxgD/62a45291d89c9bf91e6ef13c62c9efca/Group_10115.png",
-  },
-};
-
-const backgroundBottomImage = {
-  type: "image",
-  image: {
-    desktop: {
-      src: "//images.ctfassets.net/citn2sn5tdjr/7GfvRv0H0H4wt5BuNz6ML1/ab2d2a0a61665b03499f489dc39bee3e/Group_10128.png",
-      alt: "placeholder image"
-    },
-    tablet: {
-      src: "//images.ctfassets.net/citn2sn5tdjr/7GfvRv0H0H4wt5BuNz6ML1/ab2d2a0a61665b03499f489dc39bee3e/Group_10128.png",
-      alt: "placeholder image"
-    },
-    mobile: {
-      src: "//images.ctfassets.net/citn2sn5tdjr/7GfvRv0H0H4wt5BuNz6ML1/ab2d2a0a61665b03499f489dc39bee3e/Group_10128.png",
-      alt: "placeholder image"
-    },
-  },
-};
-
-const dogFocalPointImage = {
-  type: "focalPointImage",
-  focalPointImage: {
-    height: 4000,
-    title: "dog",
-    url:
-      "//images.ctfassets.net/citn2sn5tdjr/7wBhLKP8AN67gmNO0MJzsP/151f11bbe5130466fbe942aa63fd42fa/dog.jpg",
-    width: 6000,
-    x: 3549,
-    y: 1811,
-  },
-};
-
-const LeftContent = () => (
-  <></>
-);
-
-const RightContent = () => (
-  <></>
-);
-
-const content = {
-  variant: "variant-2",
-  backgroundImage: backgroundImage,
-  bottomBackgroundImage: backgroundBottomImage,
-  leftContent: <LeftContent />,
-  rightImage: dogFocalPointImage,
-  shapeType: "circle",
-  shapeBorderColor: "#0063A3",
-};
-
-return (
-	  <FullBackgroundHero
-      content={content}
-      theme={theme}
-      motion
-      paddingClass="custom-class"
-    />
-);
+#### Full Background Hero
+
+###### Props -
+
+- `content` **(required)** - object containing background images and contents for each variants
+	- `variant` - string to indicate page layout. This defaults to "variant-1"
+	    - `variant-1`       - Full page
+	    - `variant-2`       - Top - Bottom (Right shape)
+	    - `variant-2-inset` - Top - Bottom (Right content)
+	    - `variant-3`       - Top Half
+	- `backgroundImage` - object with `type` as a string and `image` as an object to support component background image. Type can be `image` or `focalPointImage`.
+	- `bottomBackgroundImage` - object with `type` as a string and `image` as an object to support component bottom background image. Type can be `image` or `focalPointImage`.
+	- `leftContent` - react component/dom element to be displayed on the left side of the Hero
+	- `rightContent` - react component/dom element to be displayed on the right side of the Hero
+	- `rightImage` - object with `type` as a string and `image` as an object to support component right image. Type can be `image` or `focalPointImage`.
+	- `shapeType` - string to indicate shape type (`quarter`, `circle`, or `triangle`) to render on the right side.
+	- `shapeBorderColor` - string to indicate the color or the shape image.
+- `theme` - object with `backgroundColor` and `color` as strings to represent hex value for background color.
+- `motion` - boolean to indicate if the content to be displayed with fade animation.
+- `paddingClass` - string to generate a custom class to pass into the outermost div of the component.
+
+###### Example -
+
+```
+const backgroundImage = {
+  type: "focalPointImage",
+  focalPointImage: {
+    x: 2000,
+    y: 2000,
+    title: "union-station-h6",
+    height: 4000,
+    width: 4000,
+    url: "//images.ctfassets.net/citn2sn5tdjr/2nAd2u2LPTRHYP2kyZRxgD/62a45291d89c9bf91e6ef13c62c9efca/Group_10115.png",
+  },
+};
+
+const backgroundBottomImage = {
+  type: "image",
+  image: {
+    desktop: {
+      src: "//images.ctfassets.net/citn2sn5tdjr/7GfvRv0H0H4wt5BuNz6ML1/ab2d2a0a61665b03499f489dc39bee3e/Group_10128.png",
+      alt: "placeholder image"
+    },
+    tablet: {
+      src: "//images.ctfassets.net/citn2sn5tdjr/7GfvRv0H0H4wt5BuNz6ML1/ab2d2a0a61665b03499f489dc39bee3e/Group_10128.png",
+      alt: "placeholder image"
+    },
+    mobile: {
+      src: "//images.ctfassets.net/citn2sn5tdjr/7GfvRv0H0H4wt5BuNz6ML1/ab2d2a0a61665b03499f489dc39bee3e/Group_10128.png",
+      alt: "placeholder image"
+    },
+  },
+};
+
+const dogFocalPointImage = {
+  type: "focalPointImage",
+  focalPointImage: {
+    height: 4000,
+    title: "dog",
+    url:
+      "//images.ctfassets.net/citn2sn5tdjr/7wBhLKP8AN67gmNO0MJzsP/151f11bbe5130466fbe942aa63fd42fa/dog.jpg",
+    width: 6000,
+    x: 3549,
+    y: 1811,
+  },
+};
+
+const LeftContent = () => (
+  <></>
+);
+
+const RightContent = () => (
+  <></>
+);
+
+const content = {
+  variant: "variant-2",
+  backgroundImage: backgroundImage,
+  bottomBackgroundImage: backgroundBottomImage,
+  leftContent: <LeftContent />,
+  rightImage: dogFocalPointImage,
+  shapeType: "circle",
+  shapeBorderColor: "#0063A3",
+};
+
+return (
+	  <FullBackgroundHero
+      content={content}
+      theme={theme}
+      motion
+      paddingClass="custom-class"
+    />
+);
 ```

package/dist/luna/components/HTMLEmbed/HTMLEmbed.scss

@@ -1,52 +1,52 @@
-@import "../../../global-styles/terra.scss";
-
-.MXP-embed {
-  &__header {
-    font-size: $heading-3-size;
-    @include benton-very-bold();
-    text-align: center;
-  }
-
-  &__subheader {
-    text-align: center;
-    font-weight: 450;
-    font-size: $subheading-size;
-  }
-
-  &__content-wrapper {
-    display: flex;
-    margin: 0 auto;
-    
-    div, section, article {
-      margin: 0 auto;
-    }
-
-    iframe {
-      margin: 0 auto;
-    }
-    &--ratio {
-      position: relative;
-      height: 100%;
-      overflow: auto;
-      &-1-1 {
-        padding-bottom: 100%;
-      }
-      &-3-4 {
-        padding-bottom: 133%;
-      }
-      &-4-3 {
-        padding-bottom: 75%;
-      }
-      & > *,
-      & > iframe {
-        position: absolute;
-        top: 0;
-        right: 0;
-        left: 0;
-        bottom: 0;
-        height: 100%;
-        width: 100%;
-      }
-    }
-  }
+@import "../../../global-styles/terra.scss";
+
+.MXP-embed {
+  &__header {
+    font-size: $heading-3-size;
+    @include benton-very-bold();
+    text-align: center;
+  }
+
+  &__subheader {
+    text-align: center;
+    font-weight: 450;
+    font-size: $subheading-size;
+  }
+
+  &__content-wrapper {
+    display: flex;
+    margin: 0 auto;
+    
+    div, section, article {
+      margin: 0 auto;
+    }
+
+    iframe {
+      margin: 0 auto;
+    }
+    &--ratio {
+      position: relative;
+      height: 100%;
+      overflow: auto;
+      &-1-1 {
+        padding-bottom: 100%;
+      }
+      &-3-4 {
+        padding-bottom: 133%;
+      }
+      &-4-3 {
+        padding-bottom: 75%;
+      }
+      & > *,
+      & > iframe {
+        position: absolute;
+        top: 0;
+        right: 0;
+        left: 0;
+        bottom: 0;
+        height: 100%;
+        width: 100%;
+      }
+    }
+  }
 }

package/dist/luna/components/HTMLEmbed/HTMLEmbedDocumentation.mdx

@@ -1,31 +1,31 @@
-#### HTMLEmbed
-
-###### Props -
-
-- `content` - object with the keys `header`, `subheader`, and `HTML` with values all strings
-- `header` - string to represent Header text. This is optional
-- `subheader` - string to represent Subheader text. This is optional
-- `HTML` - string to represent an HTML block.
-- `paddingClass` - string to generate a custom class to pass into the outermost div of the component.
-
-###### Example -
-
-```
-const header = "I am the header";
-const subheader = "I am the subheader";
-const HTML = `<iframe id="iFrameGB" width="980px" height="1200px" marginwidth="0" marginheight="0" vspace="0" hspace="0" src="https://mytrimbleprotected.com/cc/servicelocator.html" frameborder="no" scrolling="auto"></iframe>`;
-
-const content = {
-  header,
-  subheader,
-  HTML,
-};
-
-
-
-return (
-    <HTMLEmbed
-      content={content}
-    />
-);
-```
+#### HTMLEmbed
+
+###### Props -
+
+- `content` - object with the keys `header`, `subheader`, and `HTML` with values all strings
+- `header` - string to represent Header text. This is optional
+- `subheader` - string to represent Subheader text. This is optional
+- `HTML` - string to represent an HTML block.
+- `paddingClass` - string to generate a custom class to pass into the outermost div of the component.
+
+###### Example -
+
+```
+const header = "I am the header";
+const subheader = "I am the subheader";
+const HTML = `<iframe id="iFrameGB" width="980px" height="1200px" marginwidth="0" marginheight="0" vspace="0" hspace="0" src="https://mytrimbleprotected.com/cc/servicelocator.html" frameborder="no" scrolling="auto"></iframe>`;
+
+const content = {
+  header,
+  subheader,
+  HTML,
+};
+
+
+
+return (
+    <HTMLEmbed
+      content={content}
+    />
+);
+```

package/dist/luna/components/Header/Header.scss

@@ -1,36 +1,36 @@
-@import "../../../global-styles/terra.scss";
-
-.ter-header {
-  width: 100%;
-  
-  &--centered {
-    text-align: center;
-  }
-
-  &__container {
-    width: 100%;
-    margin: 0;
-
-    .eyebrow {
-      @include h1-standard-size;
-      margin: 0;
-      text-transform: uppercase;
-      font-weight: 700 !important;
-    }
-
-    .headline {
-      @include header-standard-size;
-      margin: 12px 0 0 0;
-
-      &--no-margin {
-        margin: 0;
-      }
-    }
-
-    .subhead {
-      @include subheader-standard-size;
-      margin: 6px 0 0 0;
-      font-weight: $medium-font-weight !important;
-    }
-  }
-}
+@import "../../../global-styles/terra.scss";
+
+.ter-header {
+  width: 100%;
+  
+  &--centered {
+    text-align: center;
+  }
+
+  &__container {
+    width: 100%;
+    margin: 0;
+
+    .eyebrow {
+      @include h1-standard-size;
+      margin: 0;
+      text-transform: uppercase;
+      font-weight: 700 !important;
+    }
+
+    .headline {
+      @include header-standard-size;
+      margin: 12px 0 0 0;
+
+      &--no-margin {
+        margin: 0;
+      }
+    }
+
+    .subhead {
+      @include subheader-standard-size;
+      margin: 6px 0 0 0;
+      font-weight: $medium-font-weight !important;
+    }
+  }
+}

package/dist/luna/components/Header/HeaderDocumentation.mdx

@@ -1,24 +1,24 @@
-#### Header
-
-###### Props -
-
-- `eyebrow` - string that sets the eyebrow (small text above the headline)
-- `headline` - string that sets the headline
-- `subhead` - string that sets the subhead (secondary text below the headline)
-- `theme` - object with `color` as string to represent hex value for fonts color
-
-###### Example -
-
-```
-const eyebrow = "Eyebrow option"
-const headline = "Header title"
-const subhead = "Subhead can go here."
-
-return (
-  <Header
-    eyebrow={eyebrow}
-    headline={headline}
-    subhead={subhead}
-  />
-);
-```
+#### Header
+
+###### Props -
+
+- `eyebrow` - string that sets the eyebrow (small text above the headline)
+- `headline` - string that sets the headline
+- `subhead` - string that sets the subhead (secondary text below the headline)
+- `theme` - object with `color` as string to represent hex value for fonts color
+
+###### Example -
+
+```
+const eyebrow = "Eyebrow option"
+const headline = "Header title"
+const subhead = "Subhead can go here."
+
+return (
+  <Header
+    eyebrow={eyebrow}
+    headline={headline}
+    subhead={subhead}
+  />
+);
+```