From 621f60a50e3e2963a68fddd1f0b69d7015b1187e Mon Sep 17 00:00:00 2001
From: Kyle Mathews <mathews.kyle@gmail.com>
Date: Mon, 2 Apr 2018 16:51:31 -0700
Subject: [PATCH] Fix banner styles

---
 www/src/components/navigation.js |  1 +
 www/src/layouts/index.js         |  3 +++
 www/src/pages/blog/index.js      |  1 +
 www/src/pages/plugins.js         | 10 +++++-----
 4 files changed, 10 insertions(+), 5 deletions(-)

diff --git a/www/src/components/navigation.js b/www/src/components/navigation.js
index 6796f6c3e5a9b..695bd0adeefd5 100644
--- a/www/src/components/navigation.js
+++ b/www/src/components/navigation.js
@@ -96,6 +96,7 @@ export default ({ pathname }) => {
         zIndex: `2`,
         left: 0,
         right: 0,
+        top: `calc(2.8rem - 1px)`,
         [presets.Tablet]: {
           position: isHomepage || isBlog ? `absolute` : `fixed`,
         },
diff --git a/www/src/layouts/index.js b/www/src/layouts/index.js
index 7c233366a3624..8a24130247a02 100644
--- a/www/src/layouts/index.js
+++ b/www/src/layouts/index.js
@@ -141,6 +141,8 @@ class DefaultLayout extends React.Component {
             fontFamily: options.headerFontFamily.join(`,`),
             textAlign: `center`,
             boxShadow: `inset 0px -3px 2px 0px ${colors.ui.bright}`,
+            zIndex: `2`,
+            position: isHomepage || isBlog ? `absolute` : `fixed`,
           }}
         >
           Live 2-day Gatsby training with Kyle Mathews! Sign up for{" "}
@@ -230,6 +232,7 @@ class DefaultLayout extends React.Component {
 
           <div
             css={{
+              marginTop: isHomepage || isBlog ? 0 : `calc(2.8rem - 1px)`,
               ...childrenMobileDisplay,
               [presets.Tablet]: {
                 paddingLeft: leftPadding(10),
diff --git a/www/src/pages/blog/index.js b/www/src/pages/blog/index.js
index 9593b0367b41b..b2a1cefdcfead 100644
--- a/www/src/pages/blog/index.js
+++ b/www/src/pages/blog/index.js
@@ -15,6 +15,7 @@ class BlogPostsIndex extends React.Component {
     return (
       <div
         css={{
+          marginTop: `calc(2.8rem - 1px)`,
           [presets.Tablet]: {
             background: colors.ui.whisper,
             paddingBottom: rhythm(options.blockMarginBottom * 4),
diff --git a/www/src/pages/plugins.js b/www/src/pages/plugins.js
index 13bc321e1651b..a3f8477628a76 100644
--- a/www/src/pages/plugins.js
+++ b/www/src/pages/plugins.js
@@ -4,14 +4,14 @@ import logo from "../monogram.svg"
 import { rhythm, options } from "../utils/typography"
 import presets, { colors } from "../utils/presets"
 
-class Packages extends Component {
+class Plugins extends Component {
   render() {
     return (
       <Container
         css={{
           alignItems: `center`,
           display: `flex`,
-          minHeight: `calc(100vh - ${presets.headerHeight})`,
+          minHeight: `calc(100vh - (${presets.headerHeight} + 2.8rem - 1px))`,
         }}
       >
         <div
@@ -40,7 +40,7 @@ class Packages extends Component {
               textAlign: `center`,
             }}
           >
-            Welcome to the Gatsby Package Library!
+            Welcome to the Gatsby Plugin Library!
           </h1>
           <p
             css={{
@@ -52,7 +52,7 @@ class Packages extends Component {
               textAlign: `center`,
             }}
           >
-            Please use the search bar to find packages that will make your
+            Please use the search bar to find plugins that will make your
             blazing-fast site even more awesome.
           </p>
         </div>
@@ -61,4 +61,4 @@ class Packages extends Component {
   }
 }
 
-export default Packages
+export default Plugins