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
@@ -1,2 +1 @@
-dist/
-node_modules/
+
@@ -1,13 +0,0 @@
-{
-  "lsp": {
-    "vscode-css-language-server": {
-      "settings": {
-        "css": {
-          "lint": {
-            "unknownAtRules": "ignore",
-          },
-        },
-      },
-    },
-  },
-}
@@ -1,9 +0,0 @@
-@font-face {
-    font-family: "Bokor";
-    src: url("assets/Bokor-Regular.woff2") format("woff2");
-}
-
-@import "tailwindcss";
-
-@source inline("bg-white");
-@source inline("text-black");
@@ -1,31 +0,0 @@
-<!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="preload"
-            href="static/fonts/Bokor-Regular.woff2"
-            as="font"
-            type="font/woff2"
-            crossorigin
-        />
-        <link rel="stylesheet" href="index.css" />
-    </head>
-
-    <body
-        id="body"
-        class="flex justify-center items-center h-screen overflow-hidden bg-black"
-    >
-        <h1
-            id="header"
-            onclick="window.location.href = 'mailto:me@futile.eu'"
-            class="font-semibold not-supports-[-moz-appearance:none]:font-normal font-[Bokor] text-[clamp(1em,12em,40vw)] select-none leading-none overflow-hidden text-white"
-        >
-            futile
-        </h1>
-        <script type="module" src="index.ts"></script>
-    </body>
-</html>
@@ -1,17 +0,0 @@
-function onKonamiCode(callback: () => void): void {
-  let input = "";
-  const konami =
-    "arrowuparrowuparrowdownarrowdownarrowleftarrowrightarrowleftarrowrightba";
-  document.addEventListener("keydown", (e: KeyboardEvent) => {
-    input = (input + e.key.toLowerCase()).slice(-konami.length);
-    if (input === konami) callback();
-  });
-}
-
-onKonamiCode(() => {
-  document.body.classList.toggle("bg-black");
-  document.body.classList.toggle("bg-white");
-  const header = document.getElementById("header");
-  header?.classList.toggle("text-white");
-  header?.classList.toggle("text-black");
-});
@@ -1,12 +0,0 @@
-{
-  "scripts": {
-    "dev": "vite",
-    "build": "vite build"
-  },
-  "devDependencies": {
-    "@tailwindcss/vite": "^4.2.0",
-    "tailwindcss": "^4.2.0",
-    "typescript": "^5.9.3",
-    "vite": "^7.3.1"
-  }
-}
@@ -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";
+  }
+});
@@ -1,10 +0,0 @@
-import { defineConfig } from "vite";
-import tailwindcss from "@tailwindcss/vite";
-
-export default defineConfig({
-  publicDir: "assets",
-  plugins: [tailwindcss()],
-  server: {
-    port: 6767,
-  },
-});