diff --git a/packages/sage-assets/lib/stylesheets/tokens/_font_weight.scss b/packages/sage-assets/lib/stylesheets/tokens/_font_weight.scss index b315297ac0..1348b761af 100644 --- a/packages/sage-assets/lib/stylesheets/tokens/_font_weight.scss +++ b/packages/sage-assets/lib/stylesheets/tokens/_font_weight.scss @@ -15,6 +15,13 @@ $sage-font-weights: ( bold: 725 ); +$sage-heading-font-weights: ( + regular: 400, + medium: 500, + semibold: 600, + bold: 700 +); + /// /// Sage font weight token utility /// @@ -22,7 +29,12 @@ $sage-font-weights: ( /// /// @return {number} The value retrieved /// -@function sage-font-weight($key: regular) { +@function sage-font-weight($key: regular, $heading: false) { $value: map-get($sage-font-weights, $key); + + @if $heading { + $value: map-get($sage-heading-font-weights, $key); + } + @return $value; } diff --git a/packages/sage-assets/lib/stylesheets/tokens/_type_specs.scss b/packages/sage-assets/lib/stylesheets/tokens/_type_specs.scss index 2d643b3d25..0a3d5ab30b 100644 --- a/packages/sage-assets/lib/stylesheets/tokens/_type_specs.scss +++ b/packages/sage-assets/lib/stylesheets/tokens/_type_specs.scss @@ -83,37 +83,37 @@ $sage-type-specs: ( kerning: sage-letter-spacing(5xl), responsive: true, type-pairing: h1, - weight: sage-font-weight(semibold), + weight: sage-font-weight(semibold, true), ), "heading-2": ( kerning: sage-letter-spacing(4xl), responsive: true, type-pairing: h2, - weight: sage-font-weight(semibold), + weight: sage-font-weight(semibold, true), ), "heading-3": ( kerning: sage-letter-spacing(3xl), responsive: true, type-pairing: h3, - weight: sage-font-weight(semibold), + weight: sage-font-weight(semibold, true), ), "heading-4": ( kerning: sage-letter-spacing(2xl), responsive: true, type-pairing: h4, - weight: sage-font-weight(semibold), + weight: sage-font-weight(semibold, true), ), "heading-5": ( kerning: sage-letter-spacing(xl), responsive: true, type-pairing: h5, - weight: sage-font-weight(medium), + weight: sage-font-weight(medium, true), ), "heading-6": ( kerning: sage-letter-spacing(lg), responsive: true, type-pairing: h6, - weight: sage-font-weight(medium), + weight: sage-font-weight(medium, true), ), "nav": ( responsive: false,