Spaces:
Running
Running
Ctrl+K
<!DOCTYPE html> <html lang="pt-BR"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="description" content="NerdFlix - Notícias, eventos, rankings e comunidade para fãs de animes, filmes, séries e games."> <title>NerdFlix - Home</title> <link rel="stylesheet" href="style.css"> <style> @import url('https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap'); body { background-color: #0d0d1a; color: white; font-family: 'Press Start 2P', cursive; margin: 0; } header { text-align: center; padding: 30px; background: black; } .neon { font-size: 36px; color: #fff; text-shadow: 0 0 5px #fff, 0 0 10px #8a2be2, 0 0 20px #8a2be2, 0 0 40px #00ffff; animation: flicker 2s infinite alternate; } @keyframes flicker { from { opacity: 1; } to { opacity: 0.85; } } nav { display: flex; justify-content: center; background: #1a1a2e; padding: 10px; flex-wrap: wrap; } nav a { color: #fff; text-decoration: none; padding: 10px 20px; transition: 0.3s; } nav a:hover { color: #00ffff; text-shadow: 0 0 10px #00ffff; } .banner { background: url('https://i.ibb.co/SnMqB4f/banner-anime.jpg') center/cover no-repeat; height: 300px; display: flex; align-items: center; justify-content: center; text-align: center; font-size: 22px; font-weight: bold; text-shadow: 0 0 10px black; animation: zoomIn 8s infinite alternate; } @keyframes zoomIn { from { background-size: 100%; } to { background-size: 110%; } } .grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 20px; padding: 20px; } .card { background-color: #1a1a2e; padding: 20px; border-radius: 10px; border: 2px solid #8a2be2; text-align: center; transition: transform 0.3s, box-shadow 0.3s; } .card:hover { transform: translateY(-5px) scale(1.05); box-shadow: 0 0 20px #8a2be2, 0 0 40px #00ffff; cursor: pointer; } .cta { background: linear-gradient(90deg, #8a2be2, #00ffff); color: black; padding: 15px 30px; text-align: center; font-size: 14px; margin: 20px auto; border-radius: 10px; width: fit-content; transition: 0.3s; animation: pulse 1.5s infinite; } @keyframes pulse { 0% { transform: scale(1); } 50% { transform: scale(1.05); } 100% { transform: scale(1); } } .cta:hover { background: linear-gradient(90deg, #00ffff, #8a2be2); color: white; } footer { background: #111; text-align: center; padding: 20px; font-size: 12px; border-top: 2px solid #8a2be2; } </style> </head> <body> <header> <h1 class="neon">🎥 NerdFlix</h1> <p>O mundo nerd/geek em um só lugar</p> </header> <nav> <a href="index.html">Home</a> <a href="comunidade.html">Comunidade</a> <a href="noticias.html">Notícias</a> <a href="eventos.html">Eventos</a> <a href="ranking.html">Ranking Semanal</a> <a href="integracoes.html">Integrações</a> <a href="conta.html">Sua Conta</a> </nav> <div class="banner"> Bem-vindo ao NerdFlix - Sua jornada geek começa aqui! </div> <section> <h2 style="text-align:center;">🌟 Explore o Universo Nerd</h2> <div class="grid"> <div class="card" onclick="window.location='noticias.html'"> 📰 <h3>Notícias</h3> <p>Últimas novidades do mundo geek e otaku.</p> </div> <div class="card" onclick="window.location='eventos.html'"> 🎉 <h3>Eventos</h3> <p>Encontros, convenções e campeonatos.</p> </div> <div class="card" onclick="window.location='ranking.html'"> 🏆 <h3>Ranking Semanal</h3> <p>Conteúdos mais populares da semana.</p> </div> <div class="card" onclick="window.location='comunidade.html'"> 💬 <h3>Comunidade</h3> <p>Troque ideias e participe de grupos.</p> </div> </div> </section> <div class="cta" onclick="window.location='conta.html'"> 🚀 Crie sua conta e entre para nossa guilda! </div> <footer> <strong>Sobre o Site:</strong> NerdFlix é como a Sala do Tempo de Dragon Ball, onde cada minuto vale por horas de imersão no universo geek. Aqui você se mantém informado, como o Shikamaru sempre pronto com um plano, e encontra aliados como na Guilda Fairy Tail. Seja para debater teorias, acompanhar eventos ou subir no ranking, sua aventura começa agora. 💜 </footer> </body> </html> - Initial Deployment
6007448 verified