From 69ac851e13f2d2b978910133b368da9ad2314ea4 Mon Sep 17 00:00:00 2001
From: Ben Ramey <ben.ramey@gmail.com>
Date: Thu, 13 Sep 2018 07:12:51 -0500
Subject: [PATCH] WIP on answer ky form

---
 src/components/AnswerKeyForm/index.css |  0
 src/components/AnswerKeyForm/index.js  | 14 ++++++++++++++
 src/components/App.js                  |  6 ++----
 src/components/Header/index.css        |  8 ++++++++
 src/components/Header/index.js         |  8 +++++---
 5 files changed, 29 insertions(+), 7 deletions(-)
 create mode 100644 src/components/AnswerKeyForm/index.css
 create mode 100644 src/components/AnswerKeyForm/index.js

diff --git a/src/components/AnswerKeyForm/index.css b/src/components/AnswerKeyForm/index.css
new file mode 100644
index 0000000..e69de29
diff --git a/src/components/AnswerKeyForm/index.js b/src/components/AnswerKeyForm/index.js
new file mode 100644
index 0000000..a7f98c8
--- /dev/null
+++ b/src/components/AnswerKeyForm/index.js
@@ -0,0 +1,14 @@
+import React, {Component} from 'react';
+import './index.css';
+
+class AnswerKeyForm extends Component {
+  render() {
+    return (
+      <div className="answerkeyform">
+        <h1>New Answer Key</h1>
+      </div>
+    );
+  }
+}
+
+export default AnswerKeyForm;
diff --git a/src/components/App.js b/src/components/App.js
index 51aced8..0ae4100 100644
--- a/src/components/App.js
+++ b/src/components/App.js
@@ -1,5 +1,6 @@
 import React, {Component} from 'react';
 import Header from './Header';
+import AnswerKeyForm from './AnswerKeyForm';
 
 class App extends Component {
   render() {
@@ -7,10 +8,7 @@ class App extends Component {
       <div className="App">
         <Header />
         <div className="container">
-          <div className="row">
-            <div className="three columns">First column</div>
-            <div className="nine columns">Next column</div>
-          </div>
+          <AnswerKeyForm />
         </div>
       </div>
     );
diff --git a/src/components/Header/index.css b/src/components/Header/index.css
index bb653d7..2d27d17 100644
--- a/src/components/Header/index.css
+++ b/src/components/Header/index.css
@@ -1,3 +1,11 @@
 .header hr {
   margin-top: 0;
 }
+
+.header__nav {
+  padding: 2rem 0;
+}
+
+.header__sitename {
+  padding: 0 1rem;
+}
diff --git a/src/components/Header/index.js b/src/components/Header/index.js
index dccfa6e..7a1480c 100644
--- a/src/components/Header/index.js
+++ b/src/components/Header/index.js
@@ -5,10 +5,12 @@ class Header extends Component {
   render() {
     return (
       <div className="header">
-        <nav className="nav container">
+        <nav className="header__nav container">
           <div className="row">
-            <div className="two columns">ECS Grader</div>
-            <div className="ten columns" />
+            <div className="three columns">
+              <div className="header__sitename">ECS Grader</div>
+            </div>
+            <div className="nine columns" />
           </div>
         </nav>
         <hr />