chore: error pages

package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "coryd.dev",
-  "version": "19.7.6",
+  "version": "19.8.0",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "coryd.dev",
-      "version": "19.7.6",
+      "version": "19.8.0",
       "license": "MIT",
       "dependencies": {
         "@cdransf/api-text": "^1.4.0",

package.json

@@ -1,6 +1,6 @@
 {
   "name": "coryd.dev",
-  "version": "19.7.6",
+  "version": "19.8.0",
   "description": "The source for my personal site. Built using 11ty.",
   "type": "module",
   "scripts": {

src/pages/errors/broken.html

@@ -0,0 +1,35 @@
+---
+title: Broken
+description: Hey! That's broken. Try again later.
+layout: default
+permalink: /broken.html
+image: https://cdn.coryd.dev/assets/broken.jpg
+---
+<img
+  srcset="
+    https://cdn.coryd.dev/assets/broken.jpg?aspect_ratio=1:.5625&width=256 256w,
+    https://cdn.coryd.dev/assets/broken.jpg?aspect_ratio=1:.5625&width=512 512w,
+    https://cdn.coryd.dev/assets/broken.jpg?aspect_ratio=1:.5625&width=1024 1024w,
+    https://cdn.coryd.dev/assets/broken.jpg?aspect_ratio=1:.5625&width=2048 2048w
+  "
+  sizes="(max-width: 450px) 256px,
+    (max-width: 850px) 512px,
+    (max-width: 1000px) 1024px,
+    2048px"
+  src="https://cdn.coryd.dev/assets/broken.jpg?aspect_ratio=1:.5625&width=2048"
+  alt="{{ alt }}"
+  class="image-banner"
+  style="aspect-ratio:1/0.5625"
+  loading="eager"
+  decoding="async"
+  width="768"
+  height="432"
+/>
+<div class="text-centered">
+  <h2>{{ title }}</h2>
+  <p>Hey! That's broken. Try again later.</p>
+  <p><a href="/">Go read something instead.</a></p>
+</div>
+<hr />
+{% render "partials/widgets/addon-links.liquid", popularPosts:collections.popularPosts, links:links %}
+<script>document.addEventListener('DOMContentLoaded', function () { plausible('Broken', { props: { path: document.location.pathname } }); });</script>

src/pages/errors/not-allowed.html

@@ -0,0 +1,35 @@
+---
+title: Not allowed
+description: Sometimes mildly inconvenient things happen to people. That's not allowed.
+layout: default
+permalink: /not-allowed.html
+image: https://cdn.coryd.dev/assets/not-allowed.jpg
+---
+<img
+  srcset="
+    https://cdn.coryd.dev/assets/not-allowed.jpg?aspect_ratio=1:.5625&width=256 256w,
+    https://cdn.coryd.dev/assets/not-allowed.jpg?aspect_ratio=1:.5625&width=512 512w,
+    https://cdn.coryd.dev/assets/not-allowed.jpg?aspect_ratio=1:.5625&width=1024 1024w,
+    https://cdn.coryd.dev/assets/not-allowed.jpg?aspect_ratio=1:.5625&width=2048 2048w
+  "
+  sizes="(max-width: 450px) 256px,
+    (max-width: 850px) 512px,
+    (max-width: 1000px) 1024px,
+    2048px"
+  src="https://cdn.coryd.dev/assets/not-allowed.jpg?aspect_ratio=1:.5625&width=2048"
+  alt="{{ alt }}"
+  class="image-banner"
+  style="aspect-ratio:1/0.5625"
+  loading="eager"
+  decoding="async"
+  width="768"
+  height="432"
+/>
+<div class="text-centered">
+  <h2>{{ title }}</h2>
+  <p>Sometimes mildly inconvenient things happen to people.</p>
+  <p><a href="/">Go read something instead.</a></p>
+</div>
+<hr />
+{% render "partials/widgets/addon-links.liquid", popularPosts:collections.popularPosts, links:links %}
+<script>document.addEventListener('DOMContentLoaded', function () { plausible('Not allowed', { props: { path: document.location.pathname } }); });</script>

src/pages/errors/rate-limit.html

@@ -0,0 +1,35 @@
+---
+title: Rate limit
+description: Hey! Stop that. Try again later.
+layout: default
+permalink: /rate-limit.html
+image: https://cdn.coryd.dev/assets/stop.jpg
+---
+<img
+  srcset="
+    https://cdn.coryd.dev/assets/stop.jpg?aspect_ratio=1:.5625&width=256 256w,
+    https://cdn.coryd.dev/assets/stop.jpg?aspect_ratio=1:.5625&width=512 512w,
+    https://cdn.coryd.dev/assets/stop.jpg?aspect_ratio=1:.5625&width=1024 1024w,
+    https://cdn.coryd.dev/assets/stop.jpg?aspect_ratio=1:.5625&width=2048 2048w
+  "
+  sizes="(max-width: 450px) 256px,
+    (max-width: 850px) 512px,
+    (max-width: 1000px) 1024px,
+    2048px"
+  src="https://cdn.coryd.dev/assets/stop.jpg?aspect_ratio=1:.5625&width=2048"
+  alt="{{ alt }}"
+  class="image-banner"
+  style="aspect-ratio:1/0.5625"
+  loading="eager"
+  decoding="async"
+  width="768"
+  height="432"
+/>
+<div class="text-centered">
+  <h2>{{ title }}</h2>
+  <p>Hey! Stop that. Try again later.</p>
+  <p><a href="/">Go read something instead.</a></p>
+</div>
+<hr />
+{% render "partials/widgets/addon-links.liquid", popularPosts:collections.popularPosts, links:links %}
+<script>document.addEventListener('DOMContentLoaded', function () { plausible('Rate limit', { props: { path: document.location.pathname } }); });</script>