add 404 page

expressjs · Nov 21, 2024 · 8738fc4 · 8738fc4
1 parent 8aa4cac
commit 8738fc4
Show file tree

Hide file tree

Showing 3 changed files with 44 additions and 0 deletions.
diff --git a/404.md b/404.md
@@ -0,0 +1,12 @@
+---
+layout: 404
+title: Page not found
+description: The page you requested could not be found.
+lang: en
+---
+
+# Not Found
+
+We couldn’t find the page you’re looking for. Check the address or [head back home](/).
+
+If this is a mistake, [let us know](https://github.com/expressjs/expressjs.com/issues/new/), and we will try to fix it!
diff --git a/_layouts/404.html b/_layouts/404.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+
+<html lang="en">
+  {% include head.html %}
+
+  {% if page.lang == 'en' %}
+  <body class="en-doc">
+  {% else %}
+  <body class="non-en-doc">
+  {% endif %}
+    {% include header/header-{{ page.lang }}.html %}
+    <div id="overlay"></div>
+    <main class="content-404">
+      {{ content }}
+    </main>
+    {% include footer/footer-{{ page.lang }}.html %}
+  </body>
+</html>
diff --git a/css/style.css b/css/style.css
@@ -878,6 +878,20 @@ h2 a {
   border-color: #333;
 }
 
+.content-404 {
+  height: 70vh;
+  padding: 153px 32px 7%;
+  text-align: center;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-direction: column;
+}
+
+.content-404 p {
+  font-size: 16px;
+}
+
 /* search-bar desktop re-sizing */
 @media all and (min-width: 950px) {
   .algolia-autocomplete {