From 1d1b2a4dc0052698ec1aa6ca65b69d6fba61b557 Mon Sep 17 00:00:00 2001
From: Alfred Melch <dev@melch.pro>
Date: Fri, 27 Dec 2019 11:45:10 +0100
Subject: [PATCH] Add page styling, add header/footer

---
 src/App.css | 18 ++++++++++++++++++
 src/App.js  | 12 ++++++++++--
 2 files changed, 28 insertions(+), 2 deletions(-)
 create mode 100644 src/App.css

diff --git a/src/App.css b/src/App.css
new file mode 100644
index 0000000..8256f35
--- /dev/null
+++ b/src/App.css
@@ -0,0 +1,18 @@
+body,
+html {
+  margin: 0;
+  padding: 0;
+  font-family: Arial, Helvetica, sans-serif;
+  line-height: 1.5;
+  background-color: #fce6cb;
+}
+
+header {
+  border-bottom: 2px solid white;
+  margin-bottom: 1em;
+}
+
+footer {
+  border-top: 2px solid white;
+  margin-top: 1em;
+}
diff --git a/src/App.js b/src/App.js
index da8f1a5..3093bee 100644
--- a/src/App.js
+++ b/src/App.js
@@ -3,11 +3,19 @@ import React from 'react'
 import { RsvpReader } from './components/RsvpReader'
 import { GutenbergSearch } from './components/GutenbergSearch'
 
+import './App.css'
+
 export const App = () => {
   return (
     <>
-      <RsvpReader></RsvpReader>
-      <GutenbergSearch></GutenbergSearch>
+      <header>
+        <h1>The fast reader</h1>
+      </header>
+      <main>
+        <RsvpReader></RsvpReader>
+        <GutenbergSearch></GutenbergSearch>
+      </main>
+      <footer>Made by Alfred Melch</footer>
     </>
   )
 }