From 3f2ae6f87057229235f1d22b391354f341f35a5c Mon Sep 17 00:00:00 2001
From: Zack Stickles <zstickles@gmail.com>
Date: Wed, 6 May 2020 15:42:39 -0700
Subject: [PATCH] chore: cleaned up logo classes

---
 src/components/Header.js   |  7 +++++--
 src/components/Header.scss | 16 +++++++++-------
 2 files changed, 14 insertions(+), 9 deletions(-)

diff --git a/src/components/Header.js b/src/components/Header.js
index 7ac99c702..dee0c7c40 100644
--- a/src/components/Header.js
+++ b/src/components/Header.js
@@ -23,7 +23,10 @@ const Header = ({ pages }) => {
           <h3 className="u-hideOnDesktop">Sites</h3>
           <ul>
             <li className="u-hideOnMobile">
-              <ExternalLink className="Header-nav-logo" href="//newrelic.com" />
+              <ExternalLink
+                className="logo Header-nav-logo--nr"
+                href="//newrelic.com"
+              />
             </li>
             <li>
               <Link to="/" className="is-active">
@@ -65,7 +68,7 @@ const Header = ({ pages }) => {
           <ul>
             <li>
               <ExternalLink
-                className="Header-nav-github"
+                className="logo Header-nav-logo--github"
                 href="//github.com/newrelic"
               >
                 <span className="u-hideOnDesktop">Contribute on GitHub</span>
diff --git a/src/components/Header.scss b/src/components/Header.scss
index 947dfd1cf..1b7c4c62b 100644
--- a/src/components/Header.scss
+++ b/src/components/Header.scss
@@ -5,6 +5,7 @@ header.Header--main {
     var(--color-neutrals-100) 30px,
     var(--color-white) 30px
   );
+  border-bottom: 1px solid var(--color-neutrals-100);
 
   .u-container {
     display: grid;
@@ -50,7 +51,7 @@ header.Header--main {
     grid-area: nr;
   }
 
-  .Header-nav--nr a:not(.Header-nav-logo) {
+  .Header-nav--nr a:not(.logo) {
     color: var(--color-neutrals-600);
     font-size: 0.7em;
     padding: 4px 9px;
@@ -63,14 +64,17 @@ header.Header--main {
     }
   }
 
-  .Header-nav--nr .Header-nav-logo {
+  .logo {
+    padding: 0;
+    background-size: contain;
+  }
+
+  .Header-nav--nr .Header-nav-logo--nr {
     width: 79px;
     height: 15px;
-    padding: 0;
     margin: 0.5em;
     margin-right: 1.5em;
     background-image: url('../images/NewRelic-logo.png');
-    background-size: contain;
   }
 
   .Header-nav--tools {
@@ -82,14 +86,12 @@ header.Header--main {
   }
 
   // TODO: fix this on mobile
-  .Header-nav--tools .Header-nav-github {
+  .Header-nav--tools .Header-nav-logo--github {
     width: 1.1em;
     height: 1.1em;
-    padding: 0;
     margin: 0.4em;
     opacity: 0.6;
     background-image: url('../images/GitHub-logo.png');
-    background-size: contain;
 
     &:hover {
       opacity: 1;