From 19550a82b757bd8aa40f8109048684920385c211 Mon Sep 17 00:00:00 2001
From: Jonah Aragon <jonah@triplebit.net>
Date: Tue, 2 Apr 2019 23:36:40 -0500
Subject: [PATCH] 404 Redesign

---
 404.html              | 25 +++++++++++++++++--------
 _layouts/default.html | 14 ++++++++------
 _layouts/minimal.html |  4 +---
 assets/css/style.scss |  4 ++++
 4 files changed, 30 insertions(+), 17 deletions(-)

diff --git a/404.html b/404.html
index 49233e91..6e8e7276 100644
--- a/404.html
+++ b/404.html
@@ -1,14 +1,23 @@
 ---
-layout: default
+layout: minimal
 active_page: 404
 ---
 
 <div class="container text-center">
-  <h1>404</h1>
-  <p><strong>Page not found :(</strong></p>
-  <p>We're redirecting you to the home page in 5 seconds. If this doesn't work, <a href="{{ site.url }}">click here.</a></p>
+  <h1 class="header-404">404</h1>
+  <p><strong>We couldn't find that :(</strong></p>
+  <p>Maybe you were looking for one of these pages?</p>
+  <div class="row">
+    <div class="col-md-6 offset-md-3">
+      <div class="card card-list">
+        <ul class="list-group list-group-flush">
+          <li class="list-group-item"><a href="/"><i class="fas fa-home"></i> Back to our Homepage</a></li>
+          <li class="list-group-item"><a href="/providers/"><i class="fas fa-server"></i> Privacy Focused Service Providers</a></li>
+          <li class="list-group-item"><a href="/browsers/"><i class="fas fa-compass"></i> Privacy Protecting Web Browsers</a></li>
+          <li class="list-group-item"><a href="/software/"><i class="fas fa-window-restore"></i> Privacy-Centric Software</a></li>
+        </ul>
+      </div>
+    </div>
+  </div>
+  <p class="text-danger text-center"><i class="fas fa-exclamation-circle"></i> If you believe you reached this page in error, please <a href="/contact/">contact us</a>!</p>
 </div>
-
-<script>
-  window.setTimeout(function(){ window.location = "{{ site.url }}"; },5000);
-</script>
diff --git a/_layouts/default.html b/_layouts/default.html
index fb2216b8..d21112fc 100644
--- a/_layouts/default.html
+++ b/_layouts/default.html
@@ -1,9 +1,11 @@
 ---
 layout: minimal
 ---
-<main>
-{{ content }}
-</main>
-<footer>
-{% include footer.html %}
-</footer>
+<div class="container" role="main">
+  <main>
+  {{ content }}
+  </main>
+  <footer>
+  {% include footer.html %}
+  </footer>
+</div>
diff --git a/_layouts/minimal.html b/_layouts/minimal.html
index 313a12ed..1061dc36 100644
--- a/_layouts/minimal.html
+++ b/_layouts/minimal.html
@@ -6,9 +6,7 @@
   {% include nav.html %}
   <div id="top" class="py-4"></div>
   </header>
-  <div class="container" role="main">
-    {{ content }}
-  </div>
+  {{ content }}
   {% include scripts.html %}
 </body>
 </html>
diff --git a/assets/css/style.scss b/assets/css/style.scss
index 50d26ad6..3b119a45 100644
--- a/assets/css/style.scss
+++ b/assets/css/style.scss
@@ -98,6 +98,10 @@ h2, h3:not(.h5), h4, h5 {
   margin-bottom: 1rem;
 }
 
+.header-404 {
+  font-size: 10rem;
+}
+
 .anchor-icon {
   font-size: .8em;
 }