Fix header UI

components/footer/index.js

@@ -17,7 +17,7 @@ const Footer = () => (
             <p className='meta-links'>
               &copy; roadmap.sh &middot;
               &nbsp; <a href="#">FAQ</a> &middot;
-              &nbsp; <a href="#">Terms</a> &middot;
+              &nbsp; <a href="/terms">Terms</a> &middot;
               &nbsp; <a href="#">Privacy</a>
             </p>
           </div>

components/header/index.js

@@ -4,7 +4,7 @@ const Header = () => (
   <div className='page-header'>
     <div className="top-row container">
       <div className="flex-grow-1 brand">
-        <a href="#">
+        <a href="/">
           <img src="/static/brand.png" alt="" />
         </a>
       </div>

components/header/style.scss

@@ -8,7 +8,7 @@
   }
 
   .brand img {
-    padding: 5px 10px;
+    padding: 5px 0;
     height: 50px;
     text-decoration: none;
     border-radius: 2px;

pages/home/index.js

@@ -4,7 +4,7 @@ import './style.scss';
 import HeroSection from '../../components/hero-section';
 import Footer from '../../components/footer';
 
-export const Home = (props) => (
+const Home = (props) => (
   <div className='home-container'>
     <Header />
     <HeroSection />

pages/terms/index.js

@@ -0,0 +1,15 @@
+import Header from '../../components/header';
+import Footer from '../../components/footer';
+import './style.scss';
+
+const Terms = () => (
+  <div className='terms-container'>
+    <Header />
+    <div className="container">
+      <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Doloribus, eveniet illum iure necessitatibus nisi perferendis quo quos reprehenderit totam! Architecto ex illum minus provident quaerat, reprehenderit soluta tempore voluptatem voluptates!</p>
+    </div>
+    <Footer />
+  </div>
+);
+
+export default Terms;