Spaces:
Running
Running
Criar um site para cadastramento de times para se inscrever na Franquia UNTD que significa UNIÃO NACIONAL DOS TIMES EM DESENVOLVIMENTO que é focado num aplicativo de futebol online e que no site da Franquia UNTD que deverá ter o cadastramento dos times para ter acesso ao mesmo e focar por dentro das regras, história da Franquia UNTD, dos times associado, da comunidade do WhatsApp https://chat.whatsapp.com/JnRJoExtfgs9IZr7po1COK, do nosso Instagram @franquia_untd, dos campeonatos interno que temos que são a LIGA UNTD, COPA UNTD, SUPER UNTD, CHAMPIONS, CAMP.PAGO UNTD e MUNDIAL DE CLUBES UNTD. Por fim o contato para saber mais 81997921261 - Initial Deployment
b6c156e verified | <html lang="pt-BR"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Franquia UNTD - União Nacional dos Times em Desenvolvimento</title> | |
| <script src="https://cdn.tailwindcss.com"></script> | |
| <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> | |
| <style> | |
| .gradient-bg { | |
| background: linear-gradient(135deg, #1e3a8a 0%, #2563eb 50%, #3b82f6 100%); | |
| } | |
| .team-card:hover { | |
| transform: translateY(-5px); | |
| box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1); | |
| } | |
| .championship-card { | |
| transition: all 0.3s ease; | |
| } | |
| .championship-card:hover { | |
| transform: scale(1.03); | |
| } | |
| .floating { | |
| animation: floating 3s ease-in-out infinite; | |
| } | |
| @keyframes floating { | |
| 0% { transform: translateY(0px); } | |
| 50% { transform: translateY(-10px); } | |
| 100% { transform: translateY(0px); } | |
| } | |
| </style> | |
| </head> | |
| <body class="font-sans bg-gray-50"> | |
| <!-- Navigation --> | |
| <nav class="gradient-bg text-white shadow-lg"> | |
| <div class="container mx-auto px-4 py-3"> | |
| <div class="flex justify-between items-center"> | |
| <div class="flex items-center space-x-2"> | |
| <i class="fas fa-futbol text-2xl"></i> | |
| <span class="text-xl font-bold">Franquia UNTD</span> | |
| </div> | |
| <div class="hidden md:flex space-x-6"> | |
| <a href="#about" class="hover:text-blue-200 transition">Sobre</a> | |
| <a href="#teams" class="hover:text-blue-200 transition">Times</a> | |
| <a href="#championships" class="hover:text-blue-200 transition">Campeonatos</a> | |
| <a href="#register" class="hover:text-blue-200 transition">Cadastro</a> | |
| <a href="#contact" class="hover:text-blue-200 transition">Contato</a> | |
| </div> | |
| <button id="mobile-menu-button" class="md:hidden focus:outline-none"> | |
| <i class="fas fa-bars text-xl"></i> | |
| </button> | |
| </div> | |
| <!-- Mobile menu --> | |
| <div id="mobile-menu" class="hidden md:hidden mt-2 pb-2"> | |
| <a href="#about" class="block py-2 hover:bg-blue-700 px-2 rounded">Sobre</a> | |
| <a href="#teams" class="block py-2 hover:bg-blue-700 px-2 rounded">Times</a> | |
| <a href="#championships" class="block py-2 hover:bg-blue-700 px-2 rounded">Campeonatos</a> | |
| <a href="#register" class="block py-2 hover:bg-blue-700 px-2 rounded">Cadastro</a> | |
| <a href="#contact" class="block py-2 hover:bg-blue-700 px-2 rounded">Contato</a> | |
| </div> | |
| </div> | |
| </nav> | |
| <!-- Hero Section --> | |
| <section class="gradient-bg text-white py-16 md:py-24"> | |
| <div class="container mx-auto px-4 flex flex-col md:flex-row items-center"> | |
| <div class="md:w-1/2 mb-10 md:mb-0"> | |
| <h1 class="text-4xl md:text-5xl font-bold mb-4">União Nacional dos Times em Desenvolvimento</h1> | |
| <p class="text-xl mb-6">Junte-se à maior comunidade de futebol online do Brasil e leve seu time ao topo!</p> | |
| <div class="flex flex-wrap gap-3"> | |
| <a href="#register" class="bg-white text-blue-600 font-bold px-6 py-3 rounded-full hover:bg-gray-100 transition">Cadastre seu time</a> | |
| <a href="#championships" class="border-2 border-white text-white font-bold px-6 py-3 rounded-full hover:bg-blue-700 transition">Nossos Campeonatos</a> | |
| </div> | |
| </div> | |
| <div class="md:w-1/2 flex justify-center"> | |
| <img src="https://cdn-icons-png.flaticon.com/512/3022/3022675.png" alt="Football Illustration" class="w-64 h-64 floating"> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- About Section --> | |
| <section id="about" class="py-16 bg-white"> | |
| <div class="container mx-auto px-4"> | |
| <h2 class="text-3xl font-bold text-center mb-12">Sobre a Franquia UNTD</h2> | |
| <div class="grid md:grid-cols-2 gap-8 mb-12"> | |
| <div> | |
| <h3 class="text-2xl font-semibold mb-4 text-blue-600">Nossa História</h3> | |
| <p class="text-gray-700 mb-4"> | |
| A Franquia UNTD nasceu da paixão pelo futebol virtual e da vontade de criar um espaço onde times em desenvolvimento pudessem competir, crescer e se destacar no cenário nacional. | |
| </p> | |
| <p class="text-gray-700"> | |
| Desde nossa fundação, já reunimos mais de 200 times de todo o Brasil, organizando campeonatos emocionantes e criando uma comunidade vibrante de apaixonados por futebol. | |
| </p> | |
| </div> | |
| <div> | |
| <h3 class="text-2xl font-semibold mb-4 text-blue-600">Nossa Missão</h3> | |
| <p class="text-gray-700 mb-4"> | |
| Promover o desenvolvimento de times através de competições justas, organização profissional e uma comunidade unida que compartilha conhecimento e paixão pelo esporte. | |
| </p> | |
| <p class="text-gray-700"> | |
| Queremos ser a principal referência em futebol online para times em ascensão no Brasil. | |
| </p> | |
| </div> | |
| </div> | |
| <div class="bg-blue-50 rounded-xl p-8"> | |
| <h3 class="text-2xl font-semibold mb-6 text-center text-blue-600">Junte-se à Nossa Comunidade</h3> | |
| <div class="flex flex-col md:flex-row justify-center items-center gap-6"> | |
| <a href="https://chat.whatsapp.com/JnRJoExtfgs9IZr7po1COK" target="_blank" class="bg-green-500 hover:bg-green-600 text-white font-bold px-6 py-3 rounded-full flex items-center gap-2 transition"> | |
| <i class="fab fa-whatsapp"></i> Grupo no WhatsApp | |
| </a> | |
| <a href="https://instagram.com/franquia_untd" target="_blank" class="bg-pink-500 hover:bg-pink-600 text-white font-bold px-6 py-3 rounded-full flex items-center gap-2 transition"> | |
| <i class="fab fa-instagram"></i> @franquia_untd | |
| </a> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Teams Section --> | |
| <section id="teams" class="py-16 bg-gray-100"> | |
| <div class="container mx-auto px-4"> | |
| <h2 class="text-3xl font-bold text-center mb-6">Times Associados</h2> | |
| <p class="text-center text-gray-600 mb-12 max-w-2xl mx-auto"> | |
| Conheça alguns dos times que fazem parte da nossa franquia e estão em constante desenvolvimento | |
| </p> | |
| <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-8"> | |
| <!-- Team cards will be loaded dynamically --> | |
| <div id="teams-container"></div> | |
| </div> | |
| <div class="text-center mt-10"> | |
| <button id="load-more-teams" class="bg-blue-600 hover:bg-blue-700 text-white font-bold px-6 py-3 rounded-full transition"> | |
| Carregar Mais Times | |
| </button> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Championships Section --> | |
| <section id="championships" class="py-16 bg-white"> | |
| <div class="container mx-auto px-4"> | |
| <h2 class="text-3xl font-bold text-center mb-6">Nossos Campeonatos</h2> | |
| <p class="text-center text-gray-600 mb-12 max-w-2xl mx-auto"> | |
| Competições emocionantes para todos os níveis de times | |
| </p> | |
| <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6"> | |
| <div class="championship-card bg-blue-50 rounded-xl p-6 hover:shadow-lg"> | |
| <div class="flex items-center mb-4"> | |
| <div class="bg-blue-100 p-3 rounded-full mr-4"> | |
| <i class="fas fa-trophy text-blue-600 text-xl"></i> | |
| </div> | |
| <h3 class="text-xl font-bold text-blue-800">LIGA UNTD</h3> | |
| </div> | |
| <p class="text-gray-700"> | |
| O campeonato mais tradicional da franquia, disputado ao longo de várias semanas com times de todos os níveis. | |
| </p> | |
| </div> | |
| <div class="championship-card bg-green-50 rounded-xl p-6 hover:shadow-lg"> | |
| <div class="flex items-center mb-4"> | |
| <div class="bg-green-100 p-3 rounded-full mr-4"> | |
| <i class="fas fa-medal text-green-600 text-xl"></i> | |
| </div> | |
| <h3 class="text-xl font-bold text-green-800">COPA UNTD</h3> | |
| </div> | |
| <p class="text-gray-700"> | |
| Torneio eliminatório que emociona a cada rodada, com jogos de mata-mata e muita emoção. | |
| </p> | |
| </div> | |
| <div class="championship-card bg-yellow-50 rounded-xl p-6 hover:shadow-lg"> | |
| <div class="flex items-center mb-4"> | |
| <div class="bg-yellow-100 p-3 rounded-full mr-4"> | |
| <i class="fas fa-star text-yellow-600 text-xl"></i> | |
| </div> | |
| <h3 class="text-xl font-bold text-yellow-800">SUPER UNTD</h3> | |
| </div> | |
| <p class="text-gray-700"> | |
| Competição que reúne os melhores times da franquia em confrontos de alto nível técnico. | |
| </p> | |
| </div> | |
| <div class="championship-card bg-purple-50 rounded-xl p-6 hover:shadow-lg"> | |
| <div class="flex items-center mb-4"> | |
| <div class="bg-purple-100 p-3 rounded-full mr-4"> | |
| <i class="fas fa-shield-alt text-purple-600 text-xl"></i> | |
| </div> | |
| <h3 class="text-xl font-bold text-purple-800">CHAMPIONS UNTD</h3> | |
| </div> | |
| <p class="text-gray-700"> | |
| Nosso torneio continental, inspirado na Champions League, com grupos e fases eliminatórias. | |
| </p> | |
| </div> | |
| <div class="championship-card bg-red-50 rounded-xl p-6 hover:shadow-lg"> | |
| <div class="flex items-center mb-4"> | |
| <div class="bg-red-100 p-3 rounded-full mr-4"> | |
| <i class="fas fa-money-bill-wave text-red-600 text-xl"></i> | |
| </div> | |
| <h3 class="text-xl font-bold text-red-800">CAMP.PAGO UNTD</h3> | |
| </div> | |
| <p class="text-gray-700"> | |
| Competição com premiação em dinheiro para os melhores colocados, com inscrição paga. | |
| </p> | |
| </div> | |
| <div class="championship-card bg-indigo-50 rounded-xl p-6 hover:shadow-lg"> | |
| <div class="flex items-center mb-4"> | |
| <div class="bg-indigo-100 p-3 rounded-full mr-4"> | |
| <i class="fas fa-globe-americas text-indigo-600 text-xl"></i> | |
| </div> | |
| <h3 class="text-xl font-bold text-indigo-800">MUNDIAL DE CLUBES UNTD</h3> | |
| </div> | |
| <p class="text-gray-700"> | |
| O ápice da temporada, reunindo campeões de todas as competições em um torneio internacional. | |
| </p> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Registration Section --> | |
| <section id="register" class="py-16 bg-gray-100"> | |
| <div class="container mx-auto px-4 max-w-4xl"> | |
| <div class="bg-white rounded-xl shadow-lg overflow-hidden"> | |
| <div class="md:flex"> | |
| <div class="md:w-1/2 gradient-bg text-white p-8 flex flex-col justify-center"> | |
| <h2 class="text-3xl font-bold mb-4">Cadastre seu time na UNTD</h2> | |
| <p class="mb-6"> | |
| Preencha o formulário ao lado para inscrever seu time na Franquia UNTD e comece a participar dos nossos campeonatos. | |
| </p> | |
| <div class="flex items-center"> | |
| <i class="fas fa-check-circle text-xl mr-2"></i> | |
| <span>Acesso a todos os campeonatos</span> | |
| </div> | |
| <div class="flex items-center my-2"> | |
| <i class="fas fa-check-circle text-xl mr-2"></i> | |
| <span>Comunidade exclusiva</span> | |
| </div> | |
| <div class="flex items-center"> | |
| <i class="fas fa-check-circle text-xl mr-2"></i> | |
| <span>Suporte personalizado</span> | |
| </div> | |
| </div> | |
| <div class="md:w-1/2 p-8"> | |
| <form id="registration-form" class="space-y-4"> | |
| <div> | |
| <label for="team-name" class="block text-gray-700 font-medium mb-2">Nome do Time</label> | |
| <input type="text" id="team-name" class="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500" required> | |
| </div> | |
| <div> | |
| <label for="manager-name" class="block text-gray-700 font-medium mb-2">Nome do Responsável</label> | |
| <input type="text" id="manager-name" class="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500" required> | |
| </div> | |
| <div> | |
| <label for="email" class="block text-gray-700 font-medium mb-2">E-mail</label> | |
| <input type="email" id="email" class="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500" required> | |
| </div> | |
| <div> | |
| <label for="phone" class="block text-gray-700 font-medium mb-2">WhatsApp</label> | |
| <input type="tel" id="phone" class="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500" required> | |
| </div> | |
| <div> | |
| <label for="experience" class="block text-gray-700 font-medium mb-2">Tempo de Experiência no Futebol Online</label> | |
| <select id="experience" class="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500"> | |
| <option value="beginner">Menos de 6 meses</option> | |
| <option value="intermediate">6 meses a 2 anos</option> | |
| <option value="advanced">Mais de 2 anos</option> | |
| </select> | |
| </div> | |
| <div class="pt-2"> | |
| <button type="submit" class="w-full bg-blue-600 hover:bg-blue-700 text-white font-bold py-3 px-4 rounded-lg transition"> | |
| Enviar Cadastro | |
| </button> | |
| </div> | |
| </form> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Contact Section --> | |
| <section id="contact" class="py-16 bg-white"> | |
| <div class="container mx-auto px-4"> | |
| <h2 class="text-3xl font-bold text-center mb-6">Contato</h2> | |
| <p class="text-center text-gray-600 mb-12 max-w-2xl mx-auto"> | |
| Entre em contato conosco para mais informações sobre a Franquia UNTD | |
| </p> | |
| <div class="grid md:grid-cols-2 gap-8 max-w-4xl mx-auto"> | |
| <div class="bg-gray-50 p-8 rounded-xl"> | |
| <h3 class="text-xl font-semibold mb-4">Informações de Contato</h3> | |
| <div class="space-y-4"> | |
| <div class="flex items-start"> | |
| <i class="fas fa-phone-alt text-blue-600 mt-1 mr-3"></i> | |
| <div> | |
| <h4 class="font-medium">Telefone/WhatsApp</h4> | |
| <p class="text-gray-600">(81) 99792-1261</p> | |
| </div> | |
| </div> | |
| <div class="flex items-start"> | |
| <i class="fas fa-envelope text-blue-600 mt-1 mr-3"></i> | |
| <div> | |
| <h4 class="font-medium">E-mail</h4> | |
| <p class="text-gray-600">contato@franquiauntd.com</p> | |
| </div> | |
| </div> | |
| <div class="flex items-start"> | |
| <i class="fab fa-instagram text-blue-600 mt-1 mr-3"></i> | |
| <div> | |
| <h4 class="font-medium">Instagram</h4> | |
| <p class="text-gray-600">@franquia_untd</p> | |
| </div> | |
| </div> | |
| <div class="flex items-start"> | |
| <i class="fab fa-whatsapp text-blue-600 mt-1 mr-3"></i> | |
| <div> | |
| <h4 class="font-medium">Grupo no WhatsApp</h4> | |
| <p class="text-gray-600"> | |
| <a href="https://chat.whatsapp.com/JnRJoExtfgs9IZr7po1COK" target="_blank" class="text-blue-600 hover:underline">Link do Grupo</a> | |
| </p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="bg-gray-50 p-8 rounded-xl"> | |
| <h3 class="text-xl font-semibold mb-4">Envie uma Mensagem</h3> | |
| <form class="space-y-4"> | |
| <div> | |
| <label for="contact-name" class="block text-gray-700 font-medium mb-2">Seu Nome</label> | |
| <input type="text" id="contact-name" class="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500" required> | |
| </div> | |
| <div> | |
| <label for="contact-email" class="block text-gray-700 font-medium mb-2">Seu E-mail</label> | |
| <input type="email" id="contact-email" class="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500" required> | |
| </div> | |
| <div> | |
| <label for="contact-message" class="block text-gray-700 font-medium mb-2">Sua Mensagem</label> | |
| <textarea id="contact-message" rows="4" class="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500" required></textarea> | |
| </div> | |
| <button type="submit" class="w-full bg-blue-600 hover:bg-blue-700 text-white font-bold py-3 px-4 rounded-lg transition"> | |
| Enviar Mensagem | |
| </button> | |
| </form> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Footer --> | |
| <footer class="gradient-bg text-white py-8"> | |
| <div class="container mx-auto px-4"> | |
| <div class="flex flex-col md:flex-row justify-between items-center"> | |
| <div class="mb-4 md:mb-0"> | |
| <div class="flex items-center space-x-2"> | |
| <i class="fas fa-futbol text-2xl"></i> | |
| <span class="text-xl font-bold">Franquia UNTD</span> | |
| </div> | |
| <p class="mt-2 text-sm">União Nacional dos Times em Desenvolvimento</p> | |
| </div> | |
| <div class="flex space-x-6 mb-4 md:mb-0"> | |
| <a href="#about" class="hover:text-blue-200 transition">Sobre</a> | |
| <a href="#teams" class="hover:text-blue-200 transition">Times</a> | |
| <a href="#championships" class="hover:text-blue-200 transition">Campeonatos</a> | |
| <a href="#register" class="hover:text-blue-200 transition">Cadastro</a> | |
| <a href="#contact" class="hover:text-blue-200 transition">Contato</a> | |
| </div> | |
| <div class="flex space-x-4"> | |
| <a href="https://chat.whatsapp.com/JnRJoExtfgs9IZr7po1COK" target="_blank" class="bg-green-500 hover:bg-green-600 p-2 rounded-full transition"> | |
| <i class="fab fa-whatsapp"></i> | |
| </a> | |
| <a href="https://instagram.com/franquia_untd" target="_blank" class="bg-pink-500 hover:bg-pink-600 p-2 rounded-full transition"> | |
| <i class="fab fa-instagram"></i> | |
| </a> | |
| </div> | |
| </div> | |
| <div class="border-t border-blue-400 mt-6 pt-6 text-sm text-center"> | |
| <p>© 2023 Franquia UNTD. Todos os direitos reservados.</p> | |
| </div> | |
| </div> | |
| </footer> | |
| <!-- Registration Success Modal --> | |
| <div id="success-modal" class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center hidden z-50"> | |
| <div class="bg-white rounded-xl p-8 max-w-md w-full mx-4"> | |
| <div class="text-center"> | |
| <div class="w-16 h-16 bg-green-100 rounded-full flex items-center justify-center mx-auto mb-4"> | |
| <i class="fas fa-check text-green-500 text-2xl"></i> | |
| </div> | |
| <h3 class="text-xl font-bold mb-2">Cadastro Enviado!</h3> | |
| <p class="text-gray-600 mb-6">Seu time foi cadastrado com sucesso na Franquia UNTD. Em breve entraremos em contato com mais informações.</p> | |
| <button id="close-modal" class="bg-blue-600 hover:bg-blue-700 text-white font-bold py-2 px-6 rounded-lg transition"> | |
| Fechar | |
| </button> | |
| </div> | |
| </div> | |
| </div> | |
| <script> | |
| // Sample team data | |
| const teams = [ | |
| { name: "Dragões FC", city: "São Paulo", since: "2021", logo: "dragon" }, | |
| { name: "Trovão EC", city: "Rio de Janeiro", since: "2020", logo: "bolt" }, | |
| { name: "Águias Douradas", city: "Belo Horizonte", since: "2022", logo: "eagle" }, | |
| { name: "Leões da Serra", city: "Porto Alegre", since: "2019", logo: "lion" }, | |
| { name: "Tubarões FC", city: "Recife", since: "2021", logo: "fish" }, | |
| { name: "Fênix EC", city: "Salvador", since: "2020", logo: "phoenix" }, | |
| { name: "Tigres do Norte", city: "Fortaleza", since: "2022", logo: "paw" }, | |
| { name: "Cobra Coral", city: "Curitiba", since: "2021", logo: "snake" }, | |
| { name: "Falcões FC", city: "Brasília", since: "2020", logo: "falcon" } | |
| ]; | |
| // Mobile menu toggle | |
| document.getElementById('mobile-menu-button').addEventListener('click', function() { | |
| const menu = document.getElementById('mobile-menu'); | |
| menu.classList.toggle('hidden'); | |
| }); | |
| // Load initial teams | |
| let displayedTeams = 0; | |
| const teamsPerLoad = 3; | |
| const teamsContainer = document.getElementById('teams-container'); | |
| function loadTeams() { | |
| const end = Math.min(displayedTeams + teamsPerLoad, teams.length); | |
| for (let i = displayedTeams; i < end; i++) { | |
| const team = teams[i]; | |
| const teamCard = document.createElement('div'); | |
| teamCard.className = 'team-card bg-white rounded-xl overflow-hidden shadow-md transition duration-300'; | |
| teamCard.innerHTML = ` | |
| <div class="p-6"> | |
| <div class="flex items-center mb-4"> | |
| <div class="bg-blue-100 p-3 rounded-full mr-4"> | |
| <i class="fas fa-${team.logo} text-blue-600 text-xl"></i> | |
| </div> | |
| <div> | |
| <h3 class="text-xl font-bold">${team.name}</h3> | |
| <p class="text-gray-600">${team.city}</p> | |
| </div> | |
| </div> | |
| <div class="flex justify-between items-center text-sm text-gray-500"> | |
| <span>Membro desde ${team.since}</span> | |
| <span class="bg-blue-100 text-blue-600 px-2 py-1 rounded-full text-xs">Ativo</span> | |
| </div> | |
| </div> | |
| `; | |
| teamsContainer.appendChild(teamCard); | |
| } | |
| displayedTeams = end; | |
| // Hide load more button if all teams are displayed | |
| if (displayedTeams >= teams.length) { | |
| document.getElementById('load-more-teams').classList.add('hidden'); | |
| } | |
| } | |
| // Initial load | |
| loadTeams(); | |
| // Load more teams on button click | |
| document.getElementById('load-more-teams').addEventListener('click', loadTeams); | |
| // Form submission | |
| document.getElementById('registration-form').addEventListener('submit', function(e) { | |
| e.preventDefault(); | |
| // Here you would normally send the form data to a server | |
| // For this example, we'll just show the success modal | |
| // Reset form | |
| this.reset(); | |
| // Show success modal | |
| document.getElementById('success-modal').classList.remove('hidden'); | |
| }); | |
| // Close modal | |
| document.getElementById('close-modal').addEventListener('click', function() { | |
| document.getElementById('success-modal').classList.add('hidden'); | |
| }); | |
| // Smooth scrolling for anchor links | |
| document.querySelectorAll('a[href^="#"]').forEach(anchor => { | |
| anchor.addEventListener('click', function (e) { | |
| e.preventDefault(); | |
| const targetId = this.getAttribute('href'); | |
| const targetElement = document.querySelector(targetId); | |
| if (targetElement) { | |
| // Close mobile menu if open | |
| document.getElementById('mobile-menu').classList.add('hidden'); | |
| // Scroll to target | |
| window.scrollTo({ | |
| top: targetElement.offsetTop - 80, | |
| behavior: 'smooth' | |
| }); | |
| } | |
| }); | |
| }); | |
| </script> | |
| <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://deepsite.hf.co/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://deepsite.hf.co" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://deepsite.hf.co?remix=AnthonySilva85/anthony" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body> | |
| </html> |