initial commit

2024-05-08 15:50:53 +10:00 · 2024-05-08 15:50:53 +10:00 · 311ace0e57
commit 311ace0e57
5 changed files with 635 additions and 0 deletions
--- a/torsh404.html
+++ b/torsh404.html
@ -0,0 +1,102 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <title>404, Page Not Found</title>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <style>
+      html {
+        height: 100%;
+      }
+
+      body {
+        height: 100%;
+        background: url("https://wallpapercave.com/wp/6SLzBEY.jpg") no-repeat
+          left top;
+        background-size: cover;
+        overflow: hidden;
+        display: flex;
+        flex-flow: column wrap;
+        justify-content: center;
+        align-items: center;
+      }
+
+      .text h1 {
+        color: #011718;
+        margin-top: -200px;
+        font-size: 15em;
+        text-align: center;
+        text-shadow: -5px 5px 0px rgba(0, 0, 0, 0.7),
+          -10px 10px 0px rgba(0, 0, 0, 0.4), -15px 15px 0px rgba(0, 0, 0, 0.2);
+        font-family: monospace;
+        font-weight: bold;
+      }
+
+      .text h2 {
+        color: #000;
+        font-size: 5em;
+        text-shadow: -5px 5px 0px rgba(0, 0, 0, 0.7);
+        text-align: center;
+        margin-top: -150px;
+        font-family: monospace;
+        font-weight: bold;
+      }
+
+      .text h3 {
+        color: #fff;
+        margin-left: 30px;
+        font-size: 2em;
+        text-shadow: -5px 5px 0px rgba(0, 0, 0, 0.7);
+        margin-top: -40px;
+        font-family: monospace;
+        font-weight: bold;
+        text-align: center;
+      }
+
+      /* Flashlight Overlay */
+      :root {
+        cursor: none;
+        --cursorX: 50vw;
+        --cursorY: 50vh;
+      }
+
+      :root:before {
+        content: "";
+        display: block;
+        width: 100%;
+        height: 100%;
+        position: fixed;
+        pointer-events: none;
+        background: radial-gradient(
+          circle 20vmax at var(--cursorX) var(--cursorY),
+          rgba(0, 0, 0, 0) 0%,
+          rgba(0, 0, 0, 0.5) 80%,
+          rgba(0, 0, 0, 0.95) 100%
+        );
+      }
+    </style>
+    <script>
+      function update(e) {
+        var x = e.clientX || e.touches[0].clientX;
+        var y = e.clientY || e.touches[0].clientY;
+
+        document.documentElement.style.setProperty("--cursorX", x + "px");
+        document.documentElement.style.setProperty("--cursorY", y + "px");
+      }
+
+      document.addEventListener("mousemove", update);
+      document.addEventListener("touchmove", update);
+    </script>
+  </head>
+
+  <body>
+    <div class="text">
+      <h1>404</h1>
+      <h2>Uh, Ohh</h2>
+      <h3>
+        Sorry we cant find what you are looking for, probably 'cuz its so dark
+        in here
+      </h3>
+    </div>
+  </body>
+</html>