Add a 404 page (which doesn't work yet)

404.html

@@ -0,0 +1,4 @@
+---
+layout: 2017/not_found
+---
+This cheatsheet doesn't exist.

_includes/2017/top-nav.html

@@ -8,6 +8,7 @@
       Rico's cheatsheets
     </a>
 
+    {% unless include.noshare %}
       <div class='actions'>
         {% include social-list.html class="social page-actions" page=include.page %}
 
@@ -21,5 +22,6 @@
           </ul>
         {% endif %}
       </div>
+    {% endunless %}
   </div>
 </nav>

_layouts/2017/not_found.html

@@ -0,0 +1,31 @@
+---
+type: website
+permalink: /404.html
+---
+{% include 2017/head.html %}
+{% include 2017/top-nav.html page=page noshare=true %}
+
+<div class='body-area -slim'>
+  <div class='site-header'>
+    <h1>
+      Not found
+    </h1>
+    <p>
+      Sorry, we don't have a cheatsheet for this yet. Try searching!
+    </p>
+
+    <form class='search' action='.' method='get'>
+      <label class='search-box'>
+        <!-- <span class='prefix'>devhints.io</span> -->
+        <!-- <span class='sep'>/</span> -->
+        <input name='q' type='text' placeholder='Search...' autofocus data-js-search-input>
+      </label>
+    </form>
+
+    <p class='action'>
+      <a class='push-button' href='./'>Back to home</a>
+    </p>
+  </div>
+</div>
+
+{% include 2017/foot.html %}

_sass/2017/components/site-header.scss

@@ -24,4 +24,8 @@
   & > .search {
     margin-top: 32px;
   }
+
+  & > .action {
+    margin-top: 32px;
+  }
 }