feat(type): add new type tokens for productive and expressive (carbon…

…-design-system#512) * Update type tokens * chore(type): sync changes to sass
joshblack · May 2, 2019 · 9020b75 · 9020b75
1 parent 1cc4059
commit 9020b75
Show file tree

Hide file tree

Showing 6 changed files with 419 additions and 37 deletions.
diff --git a/packages/elements/docs/sass.md b/packages/elements/docs/sass.md
@@ -198,10 +198,16 @@
   - [✅code-01 [variable]](#code-01-variable)
   - [✅code-02 [variable]](#code-02-variable)
   - [✅heading-01 [variable]](#heading-01-variable)
+  - [✅productive-heading-01 [variable]](#productive-heading-01-variable)
   - [✅heading-02 [variable]](#heading-02-variable)
+  - [✅productive-heading-02 [variable]](#productive-heading-02-variable)
   - [✅productive-heading-03 [variable]](#productive-heading-03-variable)
   - [✅productive-heading-04 [variable]](#productive-heading-04-variable)
   - [✅productive-heading-05 [variable]](#productive-heading-05-variable)
+  - [✅productive-heading-06 [variable]](#productive-heading-06-variable)
+  - [✅productive-heading-07 [variable]](#productive-heading-07-variable)
+  - [✅expressive-heading-01 [variable]](#expressive-heading-01-variable)
+  - [✅expressive-heading-02 [variable]](#expressive-heading-02-variable)
   - [✅expressive-heading-03 [variable]](#expressive-heading-03-variable)
   - [✅expressive-heading-04 [variable]](#expressive-heading-04-variable)
   - [✅expressive-heading-05 [variable]](#expressive-heading-05-variable)
@@ -6676,6 +6682,20 @@ $heading-01: (
 - **Group**: [@carbon/type](#carbontype)
 - **Type**: `Map`
 
+### ✅productive-heading-01 [variable]
+
+<details>
+<summary>Source code</summary>
+
+```scss
+$productive-heading-01: $heading-01;
+```
+
+</details>
+
+- **Group**: [@carbon/type](#carbontype)
+- **Type**: `Map`
+
 ### ✅heading-02 [variable]
 
 <details>
@@ -6695,6 +6715,20 @@ $heading-02: (
 - **Group**: [@carbon/type](#carbontype)
 - **Type**: `Map`
 
+### ✅productive-heading-02 [variable]
+
+<details>
+<summary>Source code</summary>
+
+```scss
+$productive-heading-02: $heading-02;
+```
+
+</details>
+
+- **Group**: [@carbon/type](#carbontype)
+- **Type**: `Map`
+
 ### ✅productive-heading-03 [variable]
 
 <details>
@@ -6752,6 +6786,72 @@ $productive-heading-05: (
 - **Group**: [@carbon/type](#carbontype)
 - **Type**: `Map`
 
+### ✅productive-heading-06 [variable]
+
+<details>
+<summary>Source code</summary>
+
+```scss
+$productive-heading-06: (
+  font-size: carbon--type-scale(8),
+  font-weight: carbon--font-weight('light'),
+  line-height: carbon--rem(50px),
+  letter-spacing: 0,
+);
+```
+
+</details>
+
+- **Group**: [@carbon/type](#carbontype)
+- **Type**: `Map`
+
+### ✅productive-heading-07 [variable]
+
+<details>
+<summary>Source code</summary>
+
+```scss
+$productive-heading-07: (
+  font-size: carbon--type-scale(10),
+  font-weight: carbon--font-weight('light'),
+  line-height: carbon--rem(64px),
+  letter-spacing: 0,
+);
+```
+
+</details>
+
+- **Group**: [@carbon/type](#carbontype)
+- **Type**: `Map`
+
+### ✅expressive-heading-01 [variable]
+
+<details>
+<summary>Source code</summary>
+
+```scss
+$expressive-heading-01: $heading-01;
+```
+
+</details>
+
+- **Group**: [@carbon/type](#carbontype)
+- **Type**: `Map`
+
+### ✅expressive-heading-02 [variable]
+
+<details>
+<summary>Source code</summary>
+
+```scss
+$expressive-heading-02: $heading-02;
+```
+
+</details>
+
+- **Group**: [@carbon/type](#carbontype)
+- **Type**: `Map`
+
 ### ✅expressive-heading-03 [variable]
 
 <details>
@@ -7149,10 +7249,16 @@ $tokens: (
   code-02: $code-02,
   heading-01: $heading-01,
   heading-02: $heading-02,
+  productive-heading-01: $productive-heading-01,
+  productive-heading-02: $productive-heading-02,
   productive-heading-03: $productive-heading-03,
   productive-heading-04: $productive-heading-04,
   productive-heading-05: $productive-heading-05,
+  productive-heading-06: $productive-heading-06,
+  productive-heading-07: $productive-heading-07,
   expressive-paragraph-01: $expressive-paragraph-01,
+  expressive-heading-01: $expressive-heading-01,
+  expressive-heading-02: $expressive-heading-02,
   expressive-heading-03: $expressive-heading-03,
   expressive-heading-04: $expressive-heading-04,
   expressive-heading-05: $expressive-heading-05,

diff --git a/packages/type/docs/sass.md b/packages/type/docs/sass.md
@@ -37,10 +37,16 @@
   - [✅code-01 [variable]](#code-01-variable)
   - [✅code-02 [variable]](#code-02-variable)
   - [✅heading-01 [variable]](#heading-01-variable)
+  - [✅productive-heading-01 [variable]](#productive-heading-01-variable)
   - [✅heading-02 [variable]](#heading-02-variable)
+  - [✅productive-heading-02 [variable]](#productive-heading-02-variable)
   - [✅productive-heading-03 [variable]](#productive-heading-03-variable)
   - [✅productive-heading-04 [variable]](#productive-heading-04-variable)
   - [✅productive-heading-05 [variable]](#productive-heading-05-variable)
+  - [✅productive-heading-06 [variable]](#productive-heading-06-variable)
+  - [✅productive-heading-07 [variable]](#productive-heading-07-variable)
+  - [✅expressive-heading-01 [variable]](#expressive-heading-01-variable)
+  - [✅expressive-heading-02 [variable]](#expressive-heading-02-variable)
   - [✅expressive-heading-03 [variable]](#expressive-heading-03-variable)
   - [✅expressive-heading-04 [variable]](#expressive-heading-04-variable)
   - [✅expressive-heading-05 [variable]](#expressive-heading-05-variable)
@@ -2069,6 +2075,20 @@ $heading-01: (
 - **Group**: [@carbon/type](#carbontype)
 - **Type**: `Map`
 
+### ✅productive-heading-01 [variable]
+
+<details>
+<summary>Source code</summary>
+
+```scss
+$productive-heading-01: $heading-01;
+```
+
+</details>
+
+- **Group**: [@carbon/type](#carbontype)
+- **Type**: `Map`
+
 ### ✅heading-02 [variable]
 
 <details>
@@ -2088,6 +2108,20 @@ $heading-02: (
 - **Group**: [@carbon/type](#carbontype)
 - **Type**: `Map`
 
+### ✅productive-heading-02 [variable]
+
+<details>
+<summary>Source code</summary>
+
+```scss
+$productive-heading-02: $heading-02;
+```
+
+</details>
+
+- **Group**: [@carbon/type](#carbontype)
+- **Type**: `Map`
+
 ### ✅productive-heading-03 [variable]
 
 <details>
@@ -2145,6 +2179,72 @@ $productive-heading-05: (
 - **Group**: [@carbon/type](#carbontype)
 - **Type**: `Map`
 
+### ✅productive-heading-06 [variable]
+
+<details>
+<summary>Source code</summary>
+
+```scss
+$productive-heading-06: (
+  font-size: carbon--type-scale(8),
+  font-weight: carbon--font-weight('light'),
+  line-height: carbon--rem(50px),
+  letter-spacing: 0,
+);
+```
+
+</details>
+
+- **Group**: [@carbon/type](#carbontype)
+- **Type**: `Map`
+
+### ✅productive-heading-07 [variable]
+
+<details>
+<summary>Source code</summary>
+
+```scss
+$productive-heading-07: (
+  font-size: carbon--type-scale(10),
+  font-weight: carbon--font-weight('light'),
+  line-height: carbon--rem(64px),
+  letter-spacing: 0,
+);
+```
+
+</details>
+
+- **Group**: [@carbon/type](#carbontype)
+- **Type**: `Map`
+
+### ✅expressive-heading-01 [variable]
+
+<details>
+<summary>Source code</summary>
+
+```scss
+$expressive-heading-01: $heading-01;
+```
+
+</details>
+
+- **Group**: [@carbon/type](#carbontype)
+- **Type**: `Map`
+
+### ✅expressive-heading-02 [variable]
+
+<details>
+<summary>Source code</summary>
+
+```scss
+$expressive-heading-02: $heading-02;
+```
+
+</details>
+
+- **Group**: [@carbon/type](#carbontype)
+- **Type**: `Map`
+
 ### ✅expressive-heading-03 [variable]
 
 <details>
@@ -2542,10 +2642,16 @@ $tokens: (
   code-02: $code-02,
   heading-01: $heading-01,
   heading-02: $heading-02,
+  productive-heading-01: $productive-heading-01,
+  productive-heading-02: $productive-heading-02,
   productive-heading-03: $productive-heading-03,
   productive-heading-04: $productive-heading-04,
   productive-heading-05: $productive-heading-05,
+  productive-heading-06: $productive-heading-06,
+  productive-heading-07: $productive-heading-07,
   expressive-paragraph-01: $expressive-paragraph-01,
+  expressive-heading-01: $expressive-heading-01,
+  expressive-heading-02: $expressive-heading-02,
   expressive-heading-03: $expressive-heading-03,
   expressive-heading-04: $expressive-heading-04,
   expressive-heading-05: $expressive-heading-05,

diff --git a/packages/type/scss/_styles.scss b/packages/type/scss/_styles.scss
@@ -108,6 +108,11 @@ $heading-01: (
   letter-spacing: 0.16px,
 ) !default;
 
+/// @type Map
+/// @access public
+/// @group @carbon/type
+$productive-heading-01: $heading-01 !default;
+
 /// @type Map
 /// @access public
 /// @group @carbon/type
@@ -118,6 +123,11 @@ $heading-02: (
   letter-spacing: 0,
 ) !default;
 
+/// @type Map
+/// @access public
+/// @group @carbon/type
+$productive-heading-02: $heading-02 !default;
+
 /// @type Map
 /// @access public
 /// @group @carbon/type
@@ -148,6 +158,36 @@ $productive-heading-05: (
   letter-spacing: 0,
 ) !default;
 
+/// @type Map
+/// @access public
+/// @group @carbon/type
+$productive-heading-06: (
+  font-size: carbon--type-scale(8),
+  font-weight: carbon--font-weight('light'),
+  line-height: carbon--rem(50px),
+  letter-spacing: 0,
+) !default;
+
+/// @type Map
+/// @access public
+/// @group @carbon/type
+$productive-heading-07: (
+  font-size: carbon--type-scale(10),
+  font-weight: carbon--font-weight('light'),
+  line-height: carbon--rem(64px),
+  letter-spacing: 0,
+) !default;
+
+/// @type Map
+/// @access public
+/// @group @carbon/type
+$expressive-heading-01: $heading-01 !default;
+
+/// @type Map
+/// @access public
+/// @group @carbon/type
+$expressive-heading-02: $heading-02 !default;
+
 /// @type Map
 /// @access public
 /// @group @carbon/type
@@ -443,10 +483,16 @@ $tokens: (
   code-02: $code-02,
   heading-01: $heading-01,
   heading-02: $heading-02,
+  productive-heading-01: $productive-heading-01,
+  productive-heading-02: $productive-heading-02,
   productive-heading-03: $productive-heading-03,
   productive-heading-04: $productive-heading-04,
   productive-heading-05: $productive-heading-05,
+  productive-heading-06: $productive-heading-06,
+  productive-heading-07: $productive-heading-07,
   expressive-paragraph-01: $expressive-paragraph-01,
+  expressive-heading-01: $expressive-heading-01,
+  expressive-heading-02: $expressive-heading-02,
   expressive-heading-03: $expressive-heading-03,
   expressive-heading-04: $expressive-heading-04,
   expressive-heading-05: $expressive-heading-05,