fix 404 functionality

.eleventy.js

@@ -170,29 +170,29 @@ module.exports = function (eleventyConfig) {
 	 * This so we can have and test a 404 during local dev.
 	 * @link https://www.11ty.dev/docs/config/#override-browsersync-server-options
 	 */
-	eleventyConfig.setBrowserSyncConfig({
-		notify: true,
-		snippetOptions: {
-			rule: {
-				match: /<\/head>/i,
-				fn: function (snippet, match) {
-					return snippet + match
-				},
-			},
-		},
+	// eleventyConfig.setBrowserSyncConfig({
+	// 	notify: true,
+	// 	snippetOptions: {
+	// 		rule: {
+	// 			match: /<\/head>/i,
+	// 			fn: function (snippet, match) {
+	// 				return snippet + match
+	// 			},
+	// 		},
+	// 	},
 		// Set local server 404 fallback
-		callbacks: {
-			ready: function (err, browserSync) {
-				const content_404 = fs.readFileSync('dist/404/index.html')
-
-				browserSync.addMiddleware('*', (req, res) => {
-					// Provides the 404 content without redirect.
-					res.write(content_404)
-					res.end()
-				})
-			},
-		},
-	})
+		// callbacks: {
+		// 	ready: function (err, browserSync) {
+		// 		const content_404 = fs.readFileSync('dist/404.html')
+
+		// 		browserSync.addMiddleware('*', (req, res) => {
+		// 			// Provides the 404 content without redirect.
+		// 			res.write(content_404)
+		// 			res.end()
+		// 		})
+		// 	},
+		// },
+	// })
 
 	return {
 		dir: {

src/404.md

@@ -1,22 +1,18 @@
 ---
 title: 404
 layout: page
+permalink: 404.html
 eleventyExcludeFromCollections: true
 seo:
-  title: Oooooops...
-pagination: # pagination settings so we can control how many posts are returned below
-  data: collections.post
-  size: 10
-  reverse: true
-  alias: posts
+  title: 'Oooooops...'
 ---
 
 The page you're looking for doesn't currently exist on this website. Perhaps you followed an old or bad link?
 
 Here are 10 recent posts. Perhaps one of these will help you along your way?
 
 <ol class="pt-4">
-{%- for post in posts -%}
+{%- for post in collections.post | limit(10) -%}
   <li><a class="underline" href="{{ post.url }}">{{ post.data.title }}</a></li>
 {%- endfor -%}
 </ol>

utils/filters.js

@@ -31,7 +31,17 @@ module.exports = {
 			replacement: '-',
 			remove: /[*+~.·,()'"`´%!?¿:@]/g,
 		})
-	},
+  },
+
+    /**
+   * Pass ` | limit(x)` to a Collection loop to limit the number returned
+   * Alt = ` | reverse | limit(x)` to return X most recent
+   * Took the following filters from
+   * @link https://www.youtube.com/watch?v=wV77GwOY22w&feature=share
+   */
+  limit: (arr, count = 5) => {
+    return arr.slice(0, count)
+  },
 
 	/**
 	 * Get Authors from _data/authors.json to use in Post Lists and Detail