Update line-height behavior to respect token value, size headings rel…

…ative to body text (#291)

* Normalize heading line-heights

**Why**:

- So that assigned line-heights match expectations based upon [the available token options](https://github.com/uswds/uswds/blob/61a0d99f0e6b36c3758948ba6ac46140abc5e585/src/stylesheets/theme/_uswds-theme-typography.scss#L363-L371), not influenced by either font family or scale
- So that heading line-heights can be smaller than body content, but only in the case that the actual value would be greater than that of body text (and in all other cases, using the body line-height for headings)

* Update CHANGELOG.md

CHANGELOG.md

@@ -2,6 +2,8 @@
 
 ### Improvements
 
+- Line height calculations are improved such that the [desired token size](https://github.com/uswds/uswds/blob/61a0d99f0e6b36c3758948ba6ac46140abc5e585/src/stylesheets/theme/_uswds-theme-typography.scss#L363-L371) will always apply regardless of font family or scale.
+   - In the case of headings, line-height will fall back to the configured body line-height if the resulting actual line-height would be smaller than body content when using the heading scale.
 - The Process List component no longer applies vertical padding which would affect its layout relative to surrounding content. ([#290](https://github.com/18F/identity-style-guide/pull/290))
 
 ## 6.3.1

src/scss/core/mixins/_all.scss

@@ -0,0 +1 @@
+@import 'typography';

src/scss/core/mixins/_typography.scss

@@ -0,0 +1,54 @@
+/*
+----------------------------------------
+typeset()
+----------------------------------------
+Replaces USWDS typeset to set heading
+line-height as the maximum between the
+default heading line-height and the body
+line-height when considering font-size
+----------------------------------------
+*/
+
+@mixin typeset(
+  $family: $theme-body-font-family,
+  $scale: $theme-body-font-size,
+  $line-height-scale: $theme-body-line-height
+) {
+  @if type-of($family) == 'list' {
+    $list: $family;
+    $family: if(nth($list, 1), nth($list, 1), null);
+    $scale: if(nth($list, 2), nth($list, 2), null);
+    $line-height: if(nth($list, 3), nth($list, 3), null);
+  }
+  $family: if($family == null, $theme-body-font-family, $family);
+  $scale: if($scale == null, $theme-body-font-size, $scale);
+  $line-height-scale: if($line-height-scale == null, $theme-body-line-height, $line-height-scale);
+
+  $font-size: font-size($family, $scale);
+  $line-height: lh($family, $line-height-scale);
+
+  font-family: ff($family);
+  font-size: $font-size;
+  @if (
+    $family == 'heading' and $font-size * $line-height < 1rem * lh('body', $theme-body-line-height)
+  ) {
+    $line-height: lh($family, $theme-body-line-height);
+  }
+  line-height: $line-height;
+}
+
+/*
+----------------------------------------
+h6()
+----------------------------------------
+Replaces USWDS h6 to set heading family
+----------------------------------------
+*/
+
+@mixin h6 {
+  @include typeset('heading', $theme-h6-font-size, $theme-heading-line-height);
+
+  font-weight: fw('normal');
+  letter-spacing: ls('ls-1');
+  text-transform: uppercase;
+}

src/scss/functions/_lh.scss

@@ -0,0 +1,26 @@
+/*
+----------------------------------------
+line-height()
+lh()
+----------------------------------------
+Replaces USWDS lh to remove line-height
+normalization behavior
+----------------------------------------
+*/
+
+@function lh($props...) {
+  $props: unpack($props);
+
+  @if not(length($props) == 2) {
+    @error 'lh() needs both a valid face and line height token '
+      + 'in the format `lh(FACE, HEIGHT)`.';
+  }
+
+  $scale: smart-quote(nth($props, 2));
+
+  @if not map-get($system-line-height, $scale) {
+    @return error-not-token($scale, 'line-height', $system-line-height);
+  }
+
+  @return map-get($system-line-height, $scale);
+}

src/scss/packages/_required.scss

@@ -4,7 +4,22 @@
 @import '../uswds-theme/color';
 @import '../uswds-theme/utilities';
 @import '../uswds-theme/components';
-@import '../uswds/packages/required';
+@import '../uswds/settings/settings-general';
+@import '../uswds/settings/settings-typography';
+@import '../uswds/settings/settings-color';
+@import '../uswds/settings/settings-spacing';
+@import '../uswds/settings/settings-utilities';
+@import '../uswds/settings/settings-components';
+@import '../uswds/core/functions';
+@import '../functions/lh';
+@import '../uswds/core/system-tokens';
+@import '../uswds/core/variables';
+@import '../uswds/core/properties';
+@import '../uswds/core/mixins/all';
+@import '../core/mixins/all';
+@import '../uswds/core/placeholders/all';
+@import '../uswds/core/deprecated';
+@import '../uswds/core/notifications';
 @import '../functions/asset-path';
 @import '../functions/focus';
 @import '../uswds/utilities/palettes/all';