From c4b8ee5d6375f9a636e1e433e3df874c541cad38 Mon Sep 17 00:00:00 2001
From: Tobias Ahlin <211284+tobiasahlin@users.noreply.github.com>
Date: Wed, 5 May 2021 17:36:28 +0200
Subject: [PATCH 1/3] Use separate variables for body vs headers

---
 src/marketing/support/variables.scss |  5 +++++
 src/marketing/type/typography.scss   | 25 +++++++++++++------------
 2 files changed, 18 insertions(+), 12 deletions(-)

diff --git a/src/marketing/support/variables.scss b/src/marketing/support/variables.scss
index ba3feaa7..36a8523d 100644
--- a/src/marketing/support/variables.scss
+++ b/src/marketing/support/variables.scss
@@ -61,6 +61,11 @@ $mktg-headers: (
   6: [10, 9, 9]
 ) !default;
 
+// Body content
+$mktg-body-spacing-threshold: 28px !default;
+$mktg-body-weight-threshold: 24px !default;
+$mktg-body-spacing-large: -0.01em !default;
+
 // Body size steps
 $mktg-body-size-0:  48px !default;
 $mktg-body-size-1:  40px !default;
diff --git a/src/marketing/type/typography.scss b/src/marketing/type/typography.scss
index 5f9ef436..1e8e027b 100644
--- a/src/marketing/type/typography.scss
+++ b/src/marketing/type/typography.scss
@@ -65,28 +65,29 @@
 @each $body, $sizes in $mktg-bodies {
   .f#{$body}-mktg {
     $pairing: map-get($mktg-body-pairings, nth($sizes, 1));
+    $pairing-md: map-get($mktg-body-pairings, nth($sizes, 2));
+    $pairing-lg: map-get($mktg-body-pairings, nth($sizes, 3));
+
     font-size: map-get($pairing, "size") !important;
     line-height: map-get($pairing, "lh") !important;
-    @if (map-get($pairing, "size") >= 28px) { letter-spacing: $mktg-header-spacing-default !important; }
-    @if (map-get($pairing, "size") >= 24px) { font-weight: $font-weight-semibold !important; }
+    @if (map-get($pairing, "size") >= $mktg-body-spacing-threshold) { letter-spacing: $mktg-body-spacing-large !important; }
+    @if (map-get($pairing, "size") >= $mktg-body-weight-threshold) { font-weight: $font-weight-semibold !important; }
 
     @if (nth($sizes, 1) != nth($sizes, 2)) {
       @include breakpoint(md) {
-        $pairing: map-get($mktg-body-pairings, nth($sizes, 2));
-        font-size: map-get($pairing, "size") !important;
-        line-height: map-get($pairing, "lh") !important;
-        @if (map-get($pairing, "size") >= 28px) { letter-spacing: $mktg-header-spacing-default !important; }
-        @if (map-get($pairing, "size") >= 24px) { font-weight: $font-weight-semibold !important; }
+        font-size: map-get($pairing-md, "size") !important;
+        line-height: map-get($pairing-md, "lh") !important;
+        @if (map-get($pairing-md, "size") >= $mktg-body-spacing-threshold) { letter-spacing: $mktg-body-spacing-large !important; }
+        @if (map-get($pairing-md, "size") >= $mktg-body-weight-threshold) { font-weight: $font-weight-semibold !important; }
       }
     }
 
     @if (nth($sizes, 2) != nth($sizes, 3)) {
       @include breakpoint(lg) {
-        $pairing: map-get($mktg-body-pairings, nth($sizes, 3));
-        font-size: map-get($pairing, "size") !important;
-        line-height: map-get($pairing, "lh") !important;
-        @if (map-get($pairing, "size") >= 28px) { letter-spacing: $mktg-header-spacing-default !important; }
-        @if (map-get($pairing, "size") >= 24px) { font-weight: $font-weight-semibold !important; }
+        font-size: map-get($pairing-lg, "size") !important;
+        line-height: map-get($pairing-lg, "lh") !important;
+        @if (map-get($pairing-lg, "size") >= $mktg-body-spacing-threshold) { letter-spacing: $mktg-body-spacing-large !important; }
+        @if (map-get($pairing-lg, "size") >= $mktg-body-weight-threshold) { font-weight: $font-weight-semibold !important; }
       }
     }
   }

From 8f8973a49ec179cfba331c117d9af666eaaaf7bc Mon Sep 17 00:00:00 2001
From: Tobias Ahlin <211284+tobiasahlin@users.noreply.github.com>
Date: Wed, 5 May 2021 17:44:10 +0200
Subject: [PATCH 2/3] Only override if a new value is set

---
 src/marketing/type/typography.scss | 16 ++++++++++++----
 1 file changed, 12 insertions(+), 4 deletions(-)

diff --git a/src/marketing/type/typography.scss b/src/marketing/type/typography.scss
index 1e8e027b..08251bbc 100644
--- a/src/marketing/type/typography.scss
+++ b/src/marketing/type/typography.scss
@@ -77,8 +77,12 @@
       @include breakpoint(md) {
         font-size: map-get($pairing-md, "size") !important;
         line-height: map-get($pairing-md, "lh") !important;
-        @if (map-get($pairing-md, "size") >= $mktg-body-spacing-threshold) { letter-spacing: $mktg-body-spacing-large !important; }
-        @if (map-get($pairing-md, "size") >= $mktg-body-weight-threshold) { font-weight: $font-weight-semibold !important; }
+        @if (map-get($pairing-md, "size") >= $mktg-body-spacing-threshold and map-get($pairing, "size") < $mktg-body-spacing-threshold) {
+          letter-spacing: $mktg-body-spacing-large !important;
+        }
+        @if (map-get($pairing-md, "size") >= $mktg-body-weight-threshold and map-get($pairing, "size") < $mktg-body-weight-threshold) {
+          font-weight: $font-weight-semibold !important;
+        }
       }
     }
 
@@ -86,8 +90,12 @@
       @include breakpoint(lg) {
         font-size: map-get($pairing-lg, "size") !important;
         line-height: map-get($pairing-lg, "lh") !important;
-        @if (map-get($pairing-lg, "size") >= $mktg-body-spacing-threshold) { letter-spacing: $mktg-body-spacing-large !important; }
-        @if (map-get($pairing-lg, "size") >= $mktg-body-weight-threshold) { font-weight: $font-weight-semibold !important; }
+        @if (map-get($pairing-lg, "size") >= $mktg-body-spacing-threshold and map-get($pairing-md, "size") < $mktg-body-spacing-threshold) {
+          letter-spacing: $mktg-body-spacing-large !important;
+        }
+        @if (map-get($pairing-lg, "size") >= $mktg-body-weight-threshold and map-get($pairing-md, "size") < $mktg-body-weight-threshold) {
+          font-weight: $font-weight-semibold !important;
+        }
       }
     }
   }

From 18bb377bef8f65cc75cd1faea9b2264a4061cfd0 Mon Sep 17 00:00:00 2001
From: Tobias Ahlin <hello@tobiasahlin.com>
Date: Wed, 5 May 2021 17:54:05 +0200
Subject: [PATCH 3/3] Create selfish-moose-suffer.md

---
 .changeset/selfish-moose-suffer.md | 5 +++++
 1 file changed, 5 insertions(+)
 create mode 100644 .changeset/selfish-moose-suffer.md

diff --git a/.changeset/selfish-moose-suffer.md b/.changeset/selfish-moose-suffer.md
new file mode 100644
index 00000000..a6cbd905
--- /dev/null
+++ b/.changeset/selfish-moose-suffer.md
@@ -0,0 +1,5 @@
+---
+"@primer/css": patch
+---
+
+Marketing: optimize body typography inheritance