convert to static html website

2026-07-11 05:40:51 +01:00
parent 6139e1fea8
commit 776fc5d450
15 changed files with 114 additions and 1901 deletions
@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="-40 -40 80 80">
+  <circle r="39"/>
+  <path fill="#fff" d="M0,38a38,38 0 0 1 0,-76a19,19 0 0 1 0,38a19,19 0 0 0 0,38"/>
+  <circle r="5" cy="19" fill="#fff"/>
+  <circle r="5" cy="-19"/>
+</svg>
@@ -0,0 +1,74 @@
+/* CSS reset (https://www.joshwcomeau.com/css/custom-css-reset) */
+*, *::before, *::after {
+  box-sizing: border-box;
+}
+
+*:not(dialog) {
+  margin: 0;
+}
+
+@media (prefers-reduced-motion: no-preference) {
+  html {
+    interpolate-size: allow-keywords;
+  }
+}
+
+body {
+  line-height: 1.5;
+  -webkit-font-smoothing: antialiased;
+}
+
+img, picture, video, canvas, svg {
+  display: block;
+  max-width: 100%;
+}
+
+input, button, textarea, select {
+  font: inherit;
+}
+
+p, h1, h2, h3, h4, h5, h6 {
+  overflow-wrap: break-word;
+}
+
+p {
+  text-wrap: pretty;
+}
+h1, h2, h3, h4, h5, h6 {
+  text-wrap: balance;
+}
+
+#root, #__next {
+  isolation: isolate;
+}
+/* CSS reset */
+
+@font-face {
+    font-family: "Pirata One";
+    src: url("assets/Pirata One.woff2") format("woff2");
+}
+
+.body {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    height: 100vh;
+    overflow: hidden;
+    background-color: black;
+}
+
+.header {
+    font-weight: 600;
+    font-family: Pirata One;
+    font-size: clamp(1em, 12em, 40vw);
+    user-select: none;
+    line-height: 1;
+    overflow: hidden;
+    color: white;
+}
+
+@supports not (-moz-appearance: none) {
+    .header {
+        font-weight: 400;
+    }
+}
@@ -0,0 +1,17 @@
+<!doctype html>
+<html lang="en">
+    <head>
+        <meta charset="UTF-8" />
+        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+        <title>futile</title>
+        <link rel="icon" href="assets/favicon.svg" type="image/svg+xml" />
+        <link rel="stylesheet" href="index.css" />
+    </head>
+
+    <body id="body" class="body">
+        <h1 id="header" class="header" onclick="window.location.href = 'mailto:me@futile.eu'">
+            futile
+        </h1>
+        <script src="index.js"></script>
+    </body>
+</html>
@@ -0,0 +1,22 @@
+function onKonamiCode(callback) {
+  let input = "";
+  const konami =
+    "arrowuparrowuparrowdownarrowdownarrowleftarrowrightarrowleftarrowrightba";
+  document.addEventListener("keydown", (e) => {
+    input = (input + e.key.toLowerCase()).slice(-konami.length);
+    if (input === konami) callback();
+  });
+}
+
+onKonamiCode(() => {
+  const body = document.body;
+  const header = document.getElementById("header");
+
+  if (body.style.backgroundColor === "white") {
+    body.style.backgroundColor = "black";
+    header.style.color = "white";
+  } else {
+    body.style.backgroundColor = "white";
+    header.style.color = "black";
+  }
+});