didierfranc · mildiemilk · Oct 15, 2017 · Oct 15, 2017
diff --git a/src/components/App.js b/src/components/App.js
@@ -3,7 +3,6 @@ import PropTypes from 'prop-types'
 import { connect } from 'react-redux'
 import { Route, Redirect, withRouter, Switch } from 'react-router-dom'
 import Async from 'react-code-splitting'
-
 import Login from './Auth/Login'
 import Signup from './Auth/Signup'
 import Header from './Header'

diff --git a/src/components/Header/index.js b/src/components/Header/index.js
@@ -1,10 +1,11 @@
 import React from 'react'
 
-import { Title } from '../Styled'
+import { Title, Head } from '../Styled'
 import Github from './Github'
 
 const Header = () => (
   <div>
+    <Head />
     <Title>redux-react-starter</Title>
     <Github />
   </div>

diff --git a/src/components/Home.js b/src/components/Home.js
@@ -1,5 +1,6 @@
 import React from 'react'
 import PropTypes from 'prop-types'
+// import { Link } from 'react-router-dom'
 import { connect } from 'react-redux'
 import { Redirect } from 'react-router-dom'
 
@@ -10,6 +11,9 @@ const Home = ({ user }) =>
     <Message>
       {"You're logged in as "}
       <Blue>{user.email}</Blue>
+      <a href="/login">
+        <button onClick={localStorage.clear()}>logout</button>
+      </a>
     </Message>
   ) : (
     <Redirect to="/login" />

diff --git a/src/components/Styled.js b/src/components/Styled.js
@@ -5,6 +5,13 @@ export const Body = styled.div`
   text-align: center;
   -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
 `
+export const Head = styled.div`
+  border: none;
+  background-color: #3a7bd5;
+  height: 65px;
+  width: 100%;
+  z-index: 20;
+`
 
 export const Title = styled.h1`
   font-family: sans-serif;