From d9d9dd133741391402eee61d7ff586d52b676eab Mon Sep 17 00:00:00 2001
From: Daniel Sauble <dsauble@newrelic.com>
Date: Mon, 8 Jun 2020 15:12:21 -0700
Subject: [PATCH 1/8] fix: Updates description in component reference docs to
 match Intro styling

---
 src/components/Intro.module.scss            |  6 ++----
 src/components/styles.scss                  | 10 ++++++++++
 src/templates/ComponentReferenceTemplate.js |  4 +++-
 3 files changed, 15 insertions(+), 5 deletions(-)

diff --git a/src/components/Intro.module.scss b/src/components/Intro.module.scss
index 7095b1aeb..49f01e327 100644
--- a/src/components/Intro.module.scss
+++ b/src/components/Intro.module.scss
@@ -1,5 +1,3 @@
-.container p {
-  color: var(--color-neutrals-600);
-  font-size: 1.125rem;
-  line-height: 2rem;
+.container {
+  composes: intro-text from global;
 }
diff --git a/src/components/styles.scss b/src/components/styles.scss
index 7fe6580af..3392f75cf 100644
--- a/src/components/styles.scss
+++ b/src/components/styles.scss
@@ -176,3 +176,13 @@ ul {
 li {
   margin-bottom: 1rem;
 }
+
+:global {
+  .intro-text {
+    p {
+      color: var(--color-neutrals-600);
+      font-size: 1.125rem;
+      line-height: 2rem;
+    }
+  }
+}
\ No newline at end of file
diff --git a/src/templates/ComponentReferenceTemplate.js b/src/templates/ComponentReferenceTemplate.js
index 1c88795ee..f785fed00 100644
--- a/src/templates/ComponentReferenceTemplate.js
+++ b/src/templates/ComponentReferenceTemplate.js
@@ -51,7 +51,9 @@ const ComponentReferenceTemplate = ({ data }) => {
           <section
             className={cx(templateStyles.section, templateStyles.description)}
           >
-            <ReactMarkdown source={componentDescription} />
+            <div class="intro-text">
+              <ReactMarkdown source={componentDescription} />
+            </div>
           </section>
 
           <section className={templateStyles.section}>

From 3438051196186072a2ae976b3ea4e0229caa98c6 Mon Sep 17 00:00:00 2001
From: Daniel Sauble <dsauble@newrelic.com>
Date: Mon, 8 Jun 2020 15:14:08 -0700
Subject: [PATCH 2/8] Use className instead of class

---
 src/templates/ComponentReferenceTemplate.js | 6 ++----
 1 file changed, 2 insertions(+), 4 deletions(-)

diff --git a/src/templates/ComponentReferenceTemplate.js b/src/templates/ComponentReferenceTemplate.js
index f785fed00..1deb3cf5a 100644
--- a/src/templates/ComponentReferenceTemplate.js
+++ b/src/templates/ComponentReferenceTemplate.js
@@ -49,11 +49,9 @@ const ComponentReferenceTemplate = ({ data }) => {
           <h1>{component}</h1>
 
           <section
-            className={cx(templateStyles.section, templateStyles.description)}
+            className={cx(templateStyles.section, templateStyles.description, "intro-text")}
           >
-            <div class="intro-text">
-              <ReactMarkdown source={componentDescription} />
-            </div>
+            <ReactMarkdown source={componentDescription} />
           </section>
 
           <section className={templateStyles.section}>

From e242b4b6940a01a2a4c4a346d068c8c8e9daf779 Mon Sep 17 00:00:00 2001
From: Daniel Sauble <dsauble@newrelic.com>
Date: Mon, 8 Jun 2020 15:15:15 -0700
Subject: [PATCH 3/8] Prettify code

---
 src/templates/ComponentReferenceTemplate.js | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/src/templates/ComponentReferenceTemplate.js b/src/templates/ComponentReferenceTemplate.js
index 1deb3cf5a..65781c01b 100644
--- a/src/templates/ComponentReferenceTemplate.js
+++ b/src/templates/ComponentReferenceTemplate.js
@@ -49,7 +49,11 @@ const ComponentReferenceTemplate = ({ data }) => {
           <h1>{component}</h1>
 
           <section
-            className={cx(templateStyles.section, templateStyles.description, "intro-text")}
+            className={cx(
+              templateStyles.section,
+              templateStyles.description,
+              "intro-text"
+              )}
           >
             <ReactMarkdown source={componentDescription} />
           </section>

From 7f90f2f047a6cd71440708eb9c5bda50c55605dc Mon Sep 17 00:00:00 2001
From: Daniel Sauble <dsauble@newrelic.com>
Date: Mon, 8 Jun 2020 15:15:49 -0700
Subject: [PATCH 4/8] More prettify

---
 src/templates/ComponentReferenceTemplate.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/templates/ComponentReferenceTemplate.js b/src/templates/ComponentReferenceTemplate.js
index 65781c01b..32f117deb 100644
--- a/src/templates/ComponentReferenceTemplate.js
+++ b/src/templates/ComponentReferenceTemplate.js
@@ -52,8 +52,8 @@ const ComponentReferenceTemplate = ({ data }) => {
             className={cx(
               templateStyles.section,
               templateStyles.description,
-              "intro-text"
-              )}
+              'intro-text'
+            )}
           >
             <ReactMarkdown source={componentDescription} />
           </section>

From 35715a867d316b6fec5deddb44a2169404fcda8f Mon Sep 17 00:00:00 2001
From: Daniel Sauble <dsauble@newrelic.com>
Date: Mon, 8 Jun 2020 15:18:22 -0700
Subject: [PATCH 5/8] Add missing newline

---
 src/components/styles.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/styles.scss b/src/components/styles.scss
index 3392f75cf..ff24efe35 100644
--- a/src/components/styles.scss
+++ b/src/components/styles.scss
@@ -185,4 +185,4 @@ li {
       line-height: 2rem;
     }
   }
-}
\ No newline at end of file
+}

From fcd53df168efb800d73470a35e00f04b764e07f3 Mon Sep 17 00:00:00 2001
From: Daniel Sauble <dsauble@newrelic.com>
Date: Tue, 9 Jun 2020 10:50:21 -0700
Subject: [PATCH 6/8] Make sure we're matching all the elements that can appear
 under description

---
 src/components/styles.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/styles.scss b/src/components/styles.scss
index 7e4b9c657..ee75b4d48 100644
--- a/src/components/styles.scss
+++ b/src/components/styles.scss
@@ -176,7 +176,7 @@ li {
 
 :global {
   .intro-text {
-    p {
+    * {
       color: var(--color-neutrals-600);
       font-size: 1.125rem;
       line-height: 2rem;

From 6df6c62c8cd1a5eb67506e2de1ac0b8d16fbbf86 Mon Sep 17 00:00:00 2001
From: Daniel Sauble <dsauble@newrelic.com>
Date: Tue, 9 Jun 2020 11:09:25 -0700
Subject: [PATCH 7/8] Fix specificity so we can just style the intro-text class

---
 src/components/styles.scss | 16 +++++-----------
 1 file changed, 5 insertions(+), 11 deletions(-)

diff --git a/src/components/styles.scss b/src/components/styles.scss
index ee75b4d48..52af1e1bc 100644
--- a/src/components/styles.scss
+++ b/src/components/styles.scss
@@ -82,7 +82,7 @@ body {
   margin: 0;
   font-size: 16px;
   font-family: var(--primary-font-family);
-  color: var(--color-black);
+  color: var(--color-neutrals-700);
   background-color: var(--color-white);
   line-height: 1.2;
 }
@@ -104,7 +104,6 @@ img {
 p {
   margin: 0;
   margin-top: 8px;
-  color: var(--color-neutrals-700);
 }
 
 h1,
@@ -164,10 +163,7 @@ button,
 
 ul {
   padding-left: 30px;
-  font-size: 14px;
-  line-height: 22px;
-  color: var(--color-neutrals-700);
-  font-size: 1rem;
+  line-height: 1.6rem;
 }
 
 li {
@@ -176,10 +172,8 @@ li {
 
 :global {
   .intro-text {
-    * {
-      color: var(--color-neutrals-600);
-      font-size: 1.125rem;
-      line-height: 2rem;
-    }
+    color: var(--color-neutrals-600);
+    font-size: 1.125rem;
+    line-height: 2rem;
   }
 }

From cef99df6bd420c9a643b782491fd3b99ae93484d Mon Sep 17 00:00:00 2001
From: Daniel Sauble <dsauble@newrelic.com>
Date: Tue, 9 Jun 2020 11:19:21 -0700
Subject: [PATCH 8/8] Base ul line-height on the current font size

---
 src/components/styles.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/styles.scss b/src/components/styles.scss
index 52af1e1bc..4c661a3f1 100644
--- a/src/components/styles.scss
+++ b/src/components/styles.scss
@@ -163,7 +163,7 @@ button,
 
 ul {
   padding-left: 30px;
-  line-height: 1.6rem;
+  line-height: 1.6;
 }
 
 li {