Update a few pages and give them a page wrapper

Author: lancebecker

css/main.scss

@@ -27,10 +27,11 @@ img {
     text-decoration: none;
     color: #000;
     font-weight: bold;
-    margin-right: 25px;
+    margin-right: 15px;
     padding: 0px 5px;
     font-size: 0.9rem;
     letter-spacing: 0.03rem;
+    border: 3px solid transparent;
 
     &:last-child {
       margin-right: 0;
@@ -39,7 +40,7 @@ img {
   }
 
   .highlight {
-    border: 1px solid #ccc;
+    border: 3px solid #e5cf5f;
   }
 
 }
@@ -266,24 +267,36 @@ address {
 
 .footer {
   display: flex;
-  width: 100%;
+  justify-content: center;
   min-height: 300px;
-  color: #000;
-  max-width: 1000px;
-  margin: 0 auto;
-  border-top: 3px solid #efefef;
+  color: #666;
+  margin-top: 10px;
+  border-top: 5px solid #eee;
+  padding: 20px 10%;
+}
+
+.footer-column {
+  flex: 1;
 }
 
 .footer-sitemap {
   display: flex;
   flex-direction: column;
 
   a {
-    color: #000;
+    font-size: 0.8rem;
+    color: #ccc;
     text-decoration: none;
-    font-weight: bold;
+    text-transform: uppercase;
+    transition: color 0.2 ease-out;
+
+    &:hover {
+      color: #444;
+    }
+
   }
 
+
 }
 
 .interior-page {
@@ -292,6 +305,7 @@ address {
   max-width: 960px;
   box-sizing: border-box;
   margin: 2% auto;
+  border: 5px solid #e5cf5f;
 }
 
 .code-of-conduct {

pages/_template.jsx

@@ -26,12 +26,12 @@ module.exports = React.createClass({
             <Link to={prefixLink('/about/')} >
               About
             </Link>
-            <Link to={prefixLink('/code-of-conduct/')} >
-              Code of Conduct
-            </Link>
             <Link to={prefixLink('/our_sponsors/')} >
               Current Sponsors
             </Link>
+            <Link to={prefixLink('/code-of-conduct/')} >
+              Code of Conduct
+            </Link>
             <Link className="highlight" to={prefixLink('/speak/')} >
               Speak
             </Link>
@@ -43,20 +43,36 @@ module.exports = React.createClass({
         </Container>
 
         <Container style={{ maxWidth: '100vw' }} className="footer">
-          <div className="footer-sitemap">
+          <div className="footer-column footer-sitemap">
+            <h6>Sitemap</h6>
+            <Link to={prefixLink('/')} >
+              Home
+            </Link>
             <Link to={prefixLink('/about/')} >
               About
             </Link>
-            <Link to={prefixLink('/code-of-conduct/')} >
-              Code of Conduct
-            </Link>
             <Link to={prefixLink('/our_sponsors/')} >
               Current Sponsors
             </Link>
+            <Link to={prefixLink('/code-of-conduct/')} >
+              Code of Conduct
+            </Link>
             <Link className="highlight" to={prefixLink('/speak/')} >
               Speak
             </Link>
           </div>
+          <div className="footer-column footer-social-sharing">
+            <h6>Social Sharing</h6>
+            <div className="social">
+              twitter
+            </div>
+            <div className="social">
+              facebook? 
+            </div>
+            <div className="social">
+              meetup 
+            </div>
+          </div>
         </Container>
       </div>
     )

pages/about.html

@@ -0,0 +1,3 @@
+<div class="interior-page">
+  <h1>About JavaScriptMN</h1>
+</div>

pages/about.md

@@ -0,0 +1,28 @@
+<div class="interior-page">
+
+  <h1>Speaker Questionnaire</h1>
+
+  <p>We ask that those speaking at our meetup prepare asnwers to the following questions so that we may better prepeare our members for their presentaion.</p>
+
+  <ol>
+    <li>
+      What is the title for your presentation?
+    </li>
+    <li>
+      What is a brief description of your talk? 
+    </li>
+    <li>
+      How will this improve how people work with JavaScript?
+    </li>
+    <li>
+      What is one thing people should know beforehand to better understand this talk? 
+    </li>
+    <li>
+      What are pre-meetup resources that individuals should check out? 
+    </li>
+    <li>
+      What information about you would you like to share (bio, links, contact info?)
+    </li>
+  </ol>
+
+</div>