add contact and about pages

Insoumis · Mar 11, 2017 · cf6f41a · cf6f41a
1 parent 110c866
commit cf6f41a
Show file tree

Hide file tree

Showing 8 changed files with 55 additions and 7 deletions.
diff --git a/pages/404.md b/pages/404.md
@@ -1,6 +1,7 @@
 ---
 path: /404.html
+id: notfound
 ---
 # 404 NOT FOUND
 
-Oops, voilà qui est étrange !
+Oops, voilà qui est étrange !
diff --git a/pages/about.md b/pages/about.md
@@ -0,0 +1,7 @@
+---
+path: /about
+id: about
+---
+# Contact
+
+Page à propos à ajouter
diff --git a/pages/contact.md b/pages/contact.md
@@ -0,0 +1,7 @@
+---
+path: /contact
+id: contact
+---
+# Contact
+
+Formulaire de contact à ajouter
diff --git a/styles/main.scss b/styles/main.scss
@@ -12,3 +12,10 @@ h3 {font-family: Montserrat, sans-serif;}
 
 a:focus,
 button:focus {outline: 0;}
+
+#notfound {
+  margin-top: 40px;
+  text-align: center;
+
+  h1 {color: $blue;}
+}
diff --git a/templates/Menu.scss b/templates/Menu.scss
@@ -17,7 +17,7 @@
   button {
     background: #fff;
     border: 1px solid $border;
-    color: $red;
+    color: $darkred;
     font-size: 20px;
     height: 42px;
     position: absolute;

diff --git a/templates/Outlinks.js b/templates/Outlinks.js
@@ -1,13 +1,24 @@
 import React from 'react';
-import { Container } from 'react-grid-system';
+import { Link } from 'react-router';
+import { Container, Row, Col } from 'react-grid-system';
+import { prefixLink } from 'gatsby-helpers';
 
 import './Outlinks.scss';
 
 const Outlinks = () => (
   <nav className="Outlinks">
     <Container>
-      <a href="http://www.jlm2017.fr/">jlm2017.fr</a>
-      <a href="https://laec.fr">Consultez le programme en ligne</a>
+      <Row>
+        <Col xs={6}>
+          <Link to={prefixLink('/')}><i className="fa fa-home" aria-hidden="true"></i></Link>
+          <a href="https://jlm2017.fr" target="_blank">jlm2017.fr</a>
+          <a href="https://laec.fr" target="_blank">Consultez le programme en ligne</a>
+        </Col>
+        <Col className="right" xs={6}>
+          <Link to={prefixLink('/about/')}><i className="fa fa-question-circle" aria-hidden="true"></i> À propos</Link>
+          <Link to={prefixLink('/contact/')}><i className="fa fa-envelope" aria-hidden="true"></i> Contact</Link>
+        </Col>
+      </Row>
     </Container>
   </nav>
 );

diff --git a/templates/Outlinks.scss b/templates/Outlinks.scss
@@ -3,6 +3,8 @@
 .Outlinks {
   line-height: 35px;
 
+  .right {text-align: right;}
+
   a {
     color: $secondary;
     margin: 0 10px;
@@ -14,4 +16,8 @@
 
     &:hover {color: $main;}
   }
+
+  i {padding-right: 4px;}
+
+  .fa-envelope {font-size: 15px;}
 }
diff --git a/wrappers/md.js b/wrappers/md.js
@@ -1,7 +1,16 @@
 import React from 'react';
+import { Container, Row, Col } from 'react-grid-system';
+
+const Markdown = ({ route }) => (
+  <Container>
+    <Row>
+      <Col>
+        <div id={route.page.data.id} dangerouslySetInnerHTML={{ __html: route.page.data.body }} />
+      </Col>
+    </Row>
+  </Container>
+);
 
-const Markdown = ({ route }) =>
-  <div dangerouslySetInnerHTML={{ __html: route.page.data.body }} />;
 
 Markdown.propTypes = {
   route: React.PropTypes.object