added some components to homepage

src/components/common/Navbar/Navbar.js

@@ -17,7 +17,7 @@ import { ReactComponent as DevfolioLogo } from '@images/devfolio-white.svg';
 import { ReactComponent as MenuIcon } from '@static/icons/menu.svg';
 import { ReactComponent as MenuCloseIcon } from '@static/icons/x.svg';
 
-const NAV_ITEMS = ['About', 'Gallery', 'Schedule', 'Sponsors', 'FAQ'];
+const NAV_ITEMS = ['About', 'Gallery', 'Schedule', 'Sponsors', 'FAQ', 'Contact Us'];
 
 class Navbar extends Component {
   state = {

src/components/sections/About.js

@@ -5,8 +5,8 @@ import { Section, Container } from '@components/global';
 const About = () => (
   <Section id="about" accent>
     <Container>
-      <h3>about us</h3>
       <h1>About</h1>
+      <h3>about us</h3>
       <p>
         The Sith killed each other, victims of their own greed. But from the
         ashes of their destruction, I was the last survivor. I chose to pass my

src/components/sections/Contact.js

@@ -0,0 +1,19 @@
+import React from 'react';
+
+import { Section, Container } from '@components/global';
+
+const Contact = () => (
+  <Section id="contact" accent>
+    <Container>
+      <h1>Contact Us</h1>
+
+      <p>
+        Please feel free to reach out to us in case of any issues on mailto:[email protected]
+      </p>
+
+    </Container>
+  </Section>
+);
+
+export default Contact;
+

src/components/sections/Gallery.js

@@ -47,6 +47,12 @@ const GALLERY = [
     image: 'darthvader.jpeg',
     url: 'https://twitter.com/darthvader',
   },
+  {
+    name: 'Obi Wan',
+    image: 'obi-wan.jpg',
+    url: 'https://twitter.com/obiwan',
+  },
+
 ];
 
 const Gallery = () => (

src/components/sections/Header.js

@@ -11,12 +11,17 @@ const Header = props => (
         <div style={{ width: 300 }}>
           <Image />
         </div>
+
         <div style={{ padding: '4rem' }}>
-          <h1>Hi people</h1>
+            <div style={{ padding: '2rem' }}>
+          <h1>Hi people,</h1>
           <p>
             Welcome to your new Gatsby site. <br /> Now go build something
             great.
+
           </p>
+            </div>
+
           <Button as={Link} to="/page-2/" style={{ textDecoration: 'none' }}>
             Go to page 2 &nbsp; &rarr;
           </Button>

src/components/sections/Sponsors.js

@@ -28,16 +28,18 @@ const SPONSORS = [
     label: 'Devfolio',
     link: 'https://inout.devfolio.co',
   },
+
 ];
 
 const Sponsors = () => (
   <Section id="sponsors">
+
     <Container>
       <h1 style={{ marginBottom: '4rem', textAlign: 'center' }}>Sponsors</h1>
       <Flex>
         {SPONSORS.map(({ logo: Logo, label, link }) => (
           <Sponsor href={link} key={link} aria-label={label}>
-            <Logo aria-hidden="true" />
+          <Logo aria-hidden="true" /> 
           </Sponsor>
         ))}
       </Flex>

src/pages/index.js

@@ -10,6 +10,7 @@ import Schedule from '@sections/Schedule';
 import Sponsors from '@sections/Sponsors';
 import Faq from '@sections/Faq';
 import Footer from '@sections/Footer';
+import Contact from '@sections/Contact';
 
 const IndexPage = () => (
   <Layout>
@@ -20,6 +21,7 @@ const IndexPage = () => (
     <Schedule />
     <Sponsors />
     <Faq />
+    <Contact />
     <Footer />
   </Layout>
 );