feat(heading): add xs size

generoi · Aug 28, 2020 · 8e55314 · 8e55314
1 parent 7d2add0
commit 8e55314
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 0 deletions.
diff --git a/src/components/gds-heading/_index.scss b/src/components/gds-heading/_index.scss
@@ -59,3 +59,13 @@
   text-transform: var(--heading-s-text-transform);
   letter-spacing: var(--heading-s-letter-spacing);
 }
+
+// H6
+@mixin size-xs {
+  @include base;
+  font-size: var(--heading-xs-font-size);
+  font-weight: var(--heading-xs-font-weight);
+  line-height: var(--heading-xs-line-height);
+  text-transform: var(--heading-xs-text-transform);
+  letter-spacing: var(--heading-xs-letter-spacing);
+}
diff --git a/src/components/gds-heading/gds-heading.scss b/src/components/gds-heading/gds-heading.scss
@@ -29,3 +29,7 @@ div {
 .size-s {
   @include size-s;
 }
+
+.size-xs {
+  @include size-xs;
+}
diff --git a/src/components/gds-heading/gds-heading.stories.js b/src/components/gds-heading/gds-heading.stories.js
@@ -12,5 +12,6 @@ export const Heading = () => html`
   <gds-heading size="l">L Heading</gds-heading>
   <gds-heading size="m">M Heading</gds-heading>
   <gds-heading size="s">S Heading</gds-heading>
+  <gds-heading size="xs">XS Heading</gds-heading>
   <gds-heading size="l" as="h3">L Heading rendered as h3</gds-heading>
 `