feat: Add demo landing page

2025-11-18 02:12:48 +01:00
parent 53a0460476
commit 319cf0ea1f
3 changed files with 96 additions and 0 deletions
@@ -0,0 +1,77 @@
+<!DOCTYPE html>
+<html lang="en" class="h-full">
+<head>
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  <title>forust — terminal landing</title>
+  <script src="https://cdn.tailwindcss.com"></script>
+  <style>
+    body {
+      background: #000000;
+      color: #E6E6E6;
+      font-family: 'JetBrains Mono', monospace;
+    }
+    .cursor {
+      display: inline-block;
+      width: 10px;
+      background: #00FF9C;
+      margin-left: 2px;
+      animation: blink 0.8s infinite;
+    }
+    @keyframes blink {
+      0%, 50% { opacity: 1; }
+      50.01%, 100% { opacity: 0; }
+    }
+    .scanline {
+      pointer-events: none;
+      position: fixed;
+      top: 0; left: 0;
+      width: 100%; height: 100%;
+      background: repeating-linear-gradient(
+        to bottom,
+        rgba(255,255,255,0.03) 0px,
+        rgba(255,255,255,0.03) 1px,
+        rgba(0,0,0,0) 2px
+      );
+      opacity: 0.2;
+    }
+  </style>
+</head>
+<body class="h-full flex flex-col items-center justify-center text-center p-6">
+
+  <div class="scanline"></div>
+
+  <div id="intro" class="text-xl md:text-2xl">
+    <span class="text-[#00FF9C]">forust@home:</span>~$ whoami
+    <div id="typed" class="inline"></div>
+    <div class="cursor"></div>
+  </div>
+
+  <div id="content" class="opacity-0 transition-all duration-700 mt-10 max-w-xl text-base md:text-lg text-[#9E9E9E]">
+    <p>>> OSINT / Pentesting</p>
+    <p>>> Linux enjoyer</p>
+    <p>>> self-hosting & automation</p>
+    <p class="mt-4">> projects: <span class="text-[#00FF9C]">soon™</span></p>
+  </div>
+
+<script>
+  const text = " forust";
+  const typed = document.getElementById("typed");
+  const content = document.getElementById("content");
+  let i = 0;
+
+  function type() {
+    if (i < text.length) {
+      typed.textContent += text.charAt(i);
+      i++;
+      setTimeout(type, 120);
+    } else {
+      content.classList.remove("opacity-0");
+    }
+  }
+
+  setTimeout(type, 600);
+</script>
+
+</body>
+</html>