Create index.html

TeleportAgents · Feb 10, 2025 · a679058 · a679058
1 parent 3ce6b8f
commit a679058
Showing 1 changed file with 96 additions and 0 deletions.
diff --git a/index.html b/index.html
@@ -0,0 +1,96 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  <title>TeleportAgents Founders</title>
+  <style>
+    /* Global Styles */
+    body {
+      margin: 0;
+      padding: 0;
+      font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
+      background: linear-gradient(135deg, #1a2a6c, #b21f1f, #fdbb2d);
+      background-size: 400% 400%;
+      animation: gradientBG 15s ease infinite;
+      color: #fff;
+    }
+
+    @keyframes gradientBG {
+      0% { background-position: 0% 50%; }
+      50% { background-position: 100% 50%; }
+      100% { background-position: 0% 50%; }
+    }
+
+    .container {
+      max-width: 800px;
+      margin: 0 auto;
+      padding: 100px 20px;
+      text-align: center;
+    }
+
+    h1 {
+      font-size: 3em;
+      margin-bottom: 20px;
+    }
+
+    .founder {
+      opacity: 0;
+      transform: translateY(20px);
+      transition: opacity 1s ease-out, transform 1s ease-out;
+      margin: 40px 0;
+    }
+
+    .founder.visible {
+      opacity: 1;
+      transform: translateY(0);
+    }
+
+    .founder h2 {
+      font-size: 2em;
+      margin: 0;
+    }
+
+    .founder p {
+      font-size: 1.2em;
+      margin: 5px 0 0;
+    }
+  </style>
+</head>
+<body>
+  <div class="container">
+    <h1>TeleportAgents Founders</h1>
+    <div class="founder" id="founder1">
+      <h2>Keyvan</h2>
+      <p>Artist of Games</p>
+    </div>
+    <div class="founder" id="founder2">
+      <h2>Marina</h2>
+      <p>Community Gal</p>
+    </div>
+    <div class="founder" id="founder3">
+      <h2>Ramin</h2>
+      <p>Visions of the Future</p>
+    </div>
+  </div>
+  <script>
+    // Fade-in effect on scroll
+    function reveal() {
+      var reveals = document.querySelectorAll('.founder');
+      for (var i = 0; i < reveals.length; i++) {
+        var windowHeight = window.innerHeight;
+        var elementTop = reveals[i].getBoundingClientRect().top;
+        var revealPoint = 150;
+        if (elementTop < windowHeight - revealPoint) {
+          reveals[i].classList.add('visible');
+        } else {
+          reveals[i].classList.remove('visible');
+        }
+      }
+    }
+    window.addEventListener('scroll', reveal);
+    // Trigger on load
+    reveal();
+  </script>
+</body>
+</html>