From b03b35cb683a66934a911b6f913eab6ec296d6c0 Mon Sep 17 00:00:00 2001
From: etherware-novice <73374039+etherware-novice@users.noreply.github.com>
Date: Fri, 2 Aug 2024 21:57:52 -0500
Subject: [PATCH] proper fun 404 page!

---
 404.html        | 91 ++++++++++++++++++++++++++++++++++++++-----------
 _sass/main.scss |  6 ++++
 not_found.html  | 14 ++++++++
 3 files changed, 92 insertions(+), 19 deletions(-)
 create mode 100644 not_found.html
diff --git a/404.html b/404.html
index 086a5c9..6f22a39 100644
--- a/404.html
+++ b/404.html
@@ -1,25 +1,78 @@
 ---
 permalink: /404.html
-layout: default
+layout: null
 ---
+<!doctype html>
+<html>
+	<head>
+		<meta charset="utf-8">
+		<title>!!CRASH!!</title>
+		<link rel="stylesheet" href="/assets/css/styles.css">
+	<style>
+		body, html {
+			background-color: #0000cc;
+			color: white;
+			font-size: 1.5em;
+		}
+		
+		a {
+			color: white;
+			text-decoration: none;
+		}
 
-<style type="text/css" media="screen">
-  .container {
-    margin: 10px auto;
-    max-width: 600px;
-    text-align: center;
-  }
-  h1 {
-    margin: 30px 0;
-    font-size: 4em;
-    line-height: 1;
-    letter-spacing: -1px;
-  }
-</style>
+		a:hover {
+			color: black;
+		}
 
-<div class="container">
-  <h1>404</h1>
+		.center {
+			position: fixed;
+			flex-direction: column;
+			width: 100%;
+			height: 100%;
+		}
+	</style>
+	</head>
+	<body>
+		<script data-goatcounter="https://slimepondcount.goatcounter.com/count" async src="//gc.zgo.at/count.js"></script>
 
-  <p><strong>Page not found :(</strong></p>
-  <p>The requested page could not be found.</p>
-</div>
+		<img src="/assets/images/crt1.png" class="overlay">
+		<div class="center">
+			<p>Your PC has encountered an unexpected error<br>
+			You are the <span id="crashcount">err</span> user to crash the computer<br>
+			idiot
+			</p>
+			<a href="/">reboot</a>
+		</div>
+	
+	<script>
+
+		function ordinal_suff(i) {
+			let j = i % 10,
+				k = i % 100;
+
+			if (j === 1 && k !== 11) {
+				out = i + "st";
+			}
+			else if (j === 2 && k !== 12) {
+				out = i + "nd";
+			}
+			else if (j === 3 && k !== 13) {
+				out = i + "rd";
+			}
+			else {
+				out = i + "th";
+			}
+
+			return out;
+		}
+
+		var r = new XMLHttpRequest();
+		r.addEventListener('load', function() {
+			document.querySelector('#crashcount').innerText = 
+				ordinal_suff(JSON.parse(this.responseText).count)
+		})
+		r.open('GET', 'https://slimepondcount.goatcounter.com/counter//404.json')
+		r.send()
+	</script>
+	</body>
+</html>
diff --git a/_sass/main.scss b/_sass/main.scss
index dca39b6..11a9cdf 100644
--- a/_sass/main.scss
+++ b/_sass/main.scss
@@ -63,3 +63,9 @@ img {
 	max-height: 7vh;
 	min-height: 32px;
 }
+
+.center {
+	display: flex;
+	align-items: center;
+	justify-content: center;
+}
diff --git a/not_found.html b/not_found.html
new file mode 100644
index 0000000..7f6c848
--- /dev/null
+++ b/not_found.html
@@ -0,0 +1,14 @@
+<!doctype html>
+<html>
+	<head>
+		<meta charset="utf-8">
+		<title>pre not found</title>
+		<link rel="stylesheet" href="/assets/css/styles.css">
+		<meta http-equiv="refresh" content="0; url='/404'" />
+	</head>
+	<body>
+		<p>hey bud the site isnt found<br>
+		you should be redirected <a href="/404">here</a><br>
+		this is set up this way for the funny stattracker
+		</p>
+	</body>
