From d6dfe3f446c10ba4ca0b3f247e171789bda119cf Mon Sep 17 00:00:00 2001
From: Jake Dexheimer <jakedex@gmail.com>
Date: Sun, 23 Jul 2017 12:00:31 -0500
Subject: [PATCH] Add hero text toggle

---
 components/Header.js | 15 +++++++--------
 components/Page.js   |  4 ++--
 pages/editor.js      |  2 +-
 3 files changed, 10 insertions(+), 11 deletions(-)

diff --git a/components/Header.js b/components/Header.js
index 5737875..05f73fe 100644
--- a/components/Header.js
+++ b/components/Header.js
@@ -1,31 +1,30 @@
 import React from 'react'
 import Logo from './svg/Logo'
 
-const Header = (props) => (
-  <div className="header">
+const Header = ({ enableHeroText }) => (
+  <div className="header mt3 mb4">
     <div className="header-content">
-      <a href="/"><Logo /></a>
-      <h2>The easiest way to create images from source code. Start typing, or drag a file into the text area to get started.</h2>
+      <a className="mb3" href="/"><Logo /></a>
+      { enableHeroText ? (<h2>The easiest way to create images from source code.<br/> Start typing, or drag a file into the text area to get started.</h2>) : null }
     </div>
     <style jsx>{`
       .header {
-        margin: 36px 0 72px;
         width: 632px;
       }
 
       .header-content {
         display: flex;
-        justify-content: space-between;
+        flex-direction: column;
         align-items: center;
       }
 
       .header-content a {
-        height: 128px;
+        height: 64px;
       }
 
       h2 {
+        text-align: center;
         margin-top: 0;
-        max-width: 456px;
       }
     `}</style>
   </div>
diff --git a/components/Page.js b/components/Page.js
index c5ecc4f..2269cf8 100644
--- a/components/Page.js
+++ b/components/Page.js
@@ -3,10 +3,10 @@ import Meta from './Meta'
 import Header from './Header'
 import Footer from './Footer'
 
-export default ({ children }) => (
+export default ({ children, enableHeroText }) => (
   <div className="main">
     <Meta />
-    <Header />
+    <Header enableHeroText={enableHeroText} />
     <div className="page">
       { children }
     </div>
diff --git a/pages/editor.js b/pages/editor.js
index 2463e22..d068bcc 100644
--- a/pages/editor.js
+++ b/pages/editor.js
@@ -59,7 +59,7 @@ class Editor extends React.Component {
 
   render () {
     return (
-        <Page>
+        <Page enableHeroText>
           {/* TODO this doesn't update the render */}
           <ReadFileDropContainer
             onDrop={(droppedContent) => {