Initial commit

2026-03-09 07:44:27 -07:00
commit 14031f73a3
7 changed files with 589 additions and 0 deletions
--- a/index.html
+++ b/index.html
@@ -0,0 +1,89 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
+  <meta name="theme-color" content="#0f172a" />
+  <title>Amusement - Stylish PWA Demo</title>
+  <meta name="description" content="A generic frontend demo showcasing beautiful, modern web design and PWA capabilities." />
+  
+  <!-- Fonts -->
+  <link rel="preconnect" href="https://fonts.googleapis.com">
+  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+  <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700;800&family=Outfit:wght@400;600;800&display=swap" rel="stylesheet">
+  
+  <!-- Styles -->
+  <link rel="stylesheet" href="./style.css" />
+  
+  <!-- PWA Manifest & Icons -->
+  <link rel="manifest" href="./manifest.json" />
+  <link rel="icon" type="image/svg+xml" href="./icon.svg" />
+  <link rel="apple-touch-icon" href="./icon.svg" />
+</head>
+<body>
+  <div class="background-effects">
+    <div class="blob blob-1"></div>
+    <div class="blob blob-2"></div>
+    <div class="blob blob-3"></div>
+  </div>
+
+  <main class="app-container">
+    <header class="glass-header">
+      <div class="logo">
+        <span class="logo-icon">✨</span>
+        <h1>Amusement</h1>
+      </div>
+      <nav>
+        <button class="nav-btn active">Home</button>
+        <button class="nav-btn">Features</button>
+        <button class="nav-btn primary">Get Started</button>
+      </nav>
+    </header>
+
+    <section class="hero-section">
+      <div class="hero-content">
+        <div class="badge">Next-Gen Experience</div>
+        <h2 class="display-text">Stunning visuals,<br/> <span class="gradient-text">Zero Compromises.</span></h2>
+        <p class="subtitle">Experience a breathtaking Progressive Web App designed with modern aesthetics, glassmorphism, and seamless interactions.</p>
+        
+        <div class="action-group">
+          <button class="btn btn-primary" id="installBtn" hidden>
+            <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/><polyline points="7 10 12 15 17 10"/><line x1="12" y1="15" x2="12" y2="3"/></svg>
+            Install App
+          </button>
+          <button class="btn btn-secondary">Explore Demo</button>
+        </div>
+      </div>
+      
+      <div class="hero-visual">
+        <div class="glass-card main-card">
+          <div class="card-header">
+            <div class="dots">
+              <span></span><span></span><span></span>
+            </div>
+          </div>
+          <div class="card-body">
+            <div class="skeleton-line full"></div>
+            <div class="skeleton-line medium"></div>
+            <div class="stats-grid">
+              <div class="stat-box">
+                <span class="stat-value">99%</span>
+                <span class="stat-label">Performance</span>
+              </div>
+              <div class="stat-box">
+                <span class="stat-value">PWA</span>
+                <span class="stat-label">Native Feel</span>
+              </div>
+            </div>
+            <div class="interactive-element" id="pulseElement">
+              Tap to Interact
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+  </main>
+
+  <script src="./app.js" type="module"></script>
+</body>
+</html>