Spaces:
Running
Running
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8" /> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0" /> | |
| <title>NeonGrid VR โ The Future of Indie Games</title> | |
| <link rel="icon" type="image/x-icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><text y='.9em' font-size='90'>๐ฎ</text></svg>"> | |
| <link rel="stylesheet" href="style.css" /> | |
| <script src="https://cdn.tailwindcss.com"></script> | |
| <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script> | |
| <script src="https://unpkg.com/feather-icons"></script> | |
| <script src="https://cdn.jsdelivr.net/npm/vanta@latest/dist/vanta.net.min.js"></script> | |
| </head> | |
| <body class="bg-gray-900 text-gray-100"> | |
| <custom-navbar></custom-navbar> | |
| <!-- HERO --> | |
| <section id="hero" class="relative min-h-screen flex items-center justify-center overflow-hidden"> | |
| <div id="vanta-bg" class="absolute inset-0 z-0"></div> | |
| <div class="relative z-10 text-center px-6"> | |
| <h1 class="text-5xl md:text-7xl font-extrabold tracking-tight bg-clip-text text-transparent bg-gradient-to-r from-orange-400 to-sky-400"> | |
| NeonGrid VR | |
| </h1> | |
| <p class="mt-4 text-lg md:text-2xl max-w-2xl mx-auto"> | |
| Discover, play and monetize the next generation of indie AR/VR experiences. | |
| </p> | |
| <div class="mt-8 flex flex-col sm:flex-row gap-4 justify-center"> | |
| <a href="#games" class="px-6 py-3 rounded-lg bg-orange-500 hover:bg-orange-600 text-white font-semibold transition">Explore Games</a> | |
| <a href="#upload" class="px-6 py-3 rounded-lg bg-sky-500 hover:bg-sky-600 text-white font-semibold transition">Upload Your Game</a> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- FEATURED GAMES --> | |
| <section id="games" class="py-20 px-6 max-w-7xl mx-auto"> | |
| <h2 class="text-3xl md:text-4xl font-bold mb-10 text-center">Featured AR/VR Indies</h2> | |
| <div id="game-grid" class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8"> | |
| <!-- Cards injected by JS --> | |
| </div> | |
| </section> | |
| <!-- UPLOAD --> | |
| <section id="upload" class="py-20 px-6 max-w-4xl mx-auto"> | |
| <h2 class="text-3xl md:text-4xl font-bold mb-10 text-center">Upload Your AR/VR Game</h2> | |
| <form id="upload-form" class="space-y-6"> | |
| <input type="text" placeholder="Game Title" required class="w-full px-4 py-3 rounded-lg bg-gray-800 border border-gray-700 focus:outline-none focus:ring-2 focus:ring-orange-500" /> | |
| <textarea placeholder="Short Description" rows="3" required class="w-full px-4 py-3 rounded-lg bg-gray-800 border border-gray-700 focus:outline-none focus:ring-2 focus:ring-orange-500"></textarea> | |
| <input type="url" placeholder="WebXR or Store Link" required class="w-full px-4 py-3 rounded-lg bg-gray-800 border border-gray-700 focus:outline-none focus:ring-2 focus:ring-orange-500" /> | |
| <select required class="w-full px-4 py-3 rounded-lg bg-gray-800 border border-gray-700 focus:outline-none focus:ring-2 focus:ring-orange-500"> | |
| <option disabled selected>Select Category</option> | |
| <option>AR</option> | |
| <option>VR</option> | |
| <option>Mixed Reality</option> | |
| </select> | |
| <button type="submit" class="w-full px-6 py-3 rounded-lg bg-sky-500 hover:bg-sky-600 text-white font-semibold transition">Submit</button> | |
| </form> | |
| </section> | |
| <custom-footer></custom-footer> | |
| <script src="components/navbar.js"></script> | |
| <script src="components/footer.js"></script> | |
| <script src="script.js"></script> | |
| <script>feather.replace()</script> | |
| <script src="https://deepsite.hf.co/deepsite-badge.js"></script> | |
| </body> | |
| </html> |