Merge pull request #26 from corgicode/feature/22-404-page

added 404 page

Author: dvidsilva

src/containers/404/index.js

@@ -0,0 +1,34 @@
+import React from 'react';
+import { Link } from 'react-router-dom';
+import corgi404 from '../../images/404corgi.png';
+import blueBg from '../../images/blue-bg.jpg';
+
+class e404 extends React.Component {
+    render() {
+        return(
+            <main>
+                <section id="hero" className="dark-bg img-bg img-bg-soft" style={{ backgroundImage: `url(${blueBg})` }}>
+                    <div className="container inner-top-md inner-bottom-sm">
+                        <div className="row">
+                            <div className="col-md-5 inner-right inner-bottom-xs">
+                                <header>
+                                    <h1>404 - Not found</h1>
+                                    <p>We couldn't find the page you requested, but we found this cute corgi.
+                                    </p>
+                                </header>
+                            </div>
+                            <div className="col-md-7">
+                                <div>
+                                    <img src={corgi404} alt="404 corgi" />
+                                </div>
+                                <Link to="/" className="btn btn-large">Homepage</Link>
+                            </div>
+                        </div>
+                    </div>
+                </section>
+            </main>
+        );
+    }
+}
+
+export default e404;

src/containers/app/index.js

@@ -1,15 +1,19 @@
 import React from 'react';
-import { Route } from 'react-router-dom';
+import { Route, Switch } from 'react-router-dom';
 import Home from '../home';
 import About from '../about';
+import e404 from '../404';
 import Header from '../../components/header';
 import Footer from '../../components/footer';
 
 const App = () => (
     <div>
         <Header />
-        <Route exact path="/" component={Home} />
-        <Route exact path="/about" component={About} />
+        <Switch>
+            <Route exact path="/" component={Home} />
+            <Route path="/about" component={About} />
+            <Route component={e404} />
+        </Switch>
         <Footer />
     </div>
 );