teste-addon / index.html
TheKingss010's picture
Add 3 files
8d314ac verified
Raw History Blame Contribute Delete
32.8 kB
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Mythic Realms - Addon para Minecraft Bedrock</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>
@import url('https://fonts.googleapis.com/css2?family=MedievalSharp&display=swap');
.medieval-font {
font-family: 'MedievalSharp', cursive;
}
.parallax {
background-attachment: fixed;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
.gradient-text {
background: linear-gradient(90deg, #f59e0b, #ef4444, #8b5cf6);
-webkit-background-clip: text;
background-clip: text;
color: transparent;
}
.card-hover:hover {
transform: translateY(-10px);
box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.3);
}
.pixelated {
image-rendering: pixelated;
}
</style>
</head>
<body class="bg-gray-900 text-gray-100">
<!-- Navbar -->
<nav class="bg-gray-800 bg-opacity-90 fixed w-full z-10 shadow-lg">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="flex items-center justify-between h-16">
<div class="flex items-center">
<div class="flex-shrink-0">
<span class="text-2xl font-bold gradient-text medieval-font">Mythic Realms</span>
</div>
<div class="hidden md:block">
<div class="ml-10 flex items-baseline space-x-4">
<a href="#features" class="px-3 py-2 rounded-md text-sm font-medium hover:bg-gray-700 transition">Recursos</a>
<a href="#classes" class="px-3 py-2 rounded-md text-sm font-medium hover:bg-gray-700 transition">Classes</a>
<a href="#dungeons" class="px-3 py-2 rounded-md text-sm font-medium hover:bg-gray-700 transition">Dungeons</a>
<a href="#download" class="px-3 py-2 rounded-md text-sm font-medium bg-red-600 hover:bg-red-700 transition">Download</a>
</div>
</div>
</div>
<div class="hidden md:block">
<div class="ml-4 flex items-center md:ml-6">
<span class="text-sm">Versão: 1.20+</span>
</div>
</div>
</div>
</div>
</nav>
<!-- Hero Section -->
<header class="parallax bg-[url('https://i.imgur.com/JXZQZ9x.png')] h-screen flex items-center justify-center relative">
<div class="absolute inset-0 bg-black bg-opacity-60"></div>
<div class="text-center z-10 px-4">
<h1 class="text-5xl md:text-7xl font-bold mb-6 gradient-text medieval-font">Mythic Realms</h1>
<p class="text-xl md:text-2xl mb-8 max-w-3xl mx-auto">O mais ambicioso addon de RPG para Minecraft Bedrock! Explore dungeons, domine classes, derrote bosses épicos e descubra um mundo de magia e aventura.</p>
<div class="flex justify-center gap-4">
<a href="#download" class="px-8 py-3 bg-red-600 hover:bg-red-700 rounded-lg font-bold transition transform hover:scale-105">Baixar Agora</a>
<a href="#features" class="px-8 py-3 bg-gray-700 hover:bg-gray-600 rounded-lg font-bold transition transform hover:scale-105">Explorar Recursos</a>
</div>
</div>
<div class="absolute bottom-10 left-0 right-0 flex justify-center animate-bounce">
<a href="#features" class="text-3xl text-white"><i class="fas fa-chevron-down"></i></a>
</div>
</header>
<!-- Features Section -->
<section id="features" class="py-20 bg-gray-800">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<h2 class="text-4xl font-bold text-center mb-16 gradient-text">Recursos Principais</h2>
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
<!-- Feature 1 -->
<div class="bg-gray-700 rounded-xl p-6 transition duration-300 card-hover">
<div class="text-4xl mb-4 text-red-500"><i class="fas fa-chess-queen"></i></div>
<h3 class="text-2xl font-bold mb-3">5 Classes Únicas</h3>
<p class="text-gray-300">Guerreiro, Mago, Arqueiro, Assassino e Clérigo - cada um com habilidades especiais, árvores de talentos e equipamentos exclusivos.</p>
</div>
<!-- Feature 2 -->
<div class="bg-gray-700 rounded-xl p-6 transition duration-300 card-hover">
<div class="text-4xl mb-4 text-blue-500"><i class="fas fa-dungeon"></i></div>
<h3 class="text-2xl font-bold mb-3">8 Dungeons Diferentes</h3>
<p class="text-gray-300">Explore masmorras temáticas com puzzles, armadilhas e bosses únicos. Cada dungeon oferece recompensas especiais.</p>
</div>
<!-- Feature 3 -->
<div class="bg-gray-700 rounded-xl p-6 transition duration-300 card-hover">
<div class="text-4xl mb-4 text-purple-500"><i class="fas fa-hat-wizard"></i></div>
<h3 class="text-2xl font-bold mb-3">Sistema de Magia</h3>
<p class="text-gray-300">Mais de 30 feitiços diferentes para aprender e combinar. Crie sua própria build mágica!</p>
</div>
<!-- Feature 4 -->
<div class="bg-gray-700 rounded-xl p-6 transition duration-300 card-hover">
<div class="text-4xl mb-4 text-yellow-500"><i class="fas fa-horse-head"></i></div>
<h3 class="text-2xl font-bold mb-3">Montarias Épicas</h3>
<p class="text-gray-300">Domine criaturas mágicas como dragões, grifos e lobos sombrios. Cada montaria tem habilidades especiais.</p>
</div>
<!-- Feature 5 -->
<div class="bg-gray-700 rounded-xl p-6 transition duration-300 card-hover">
<div class="text-4xl mb-4 text-green-500"><i class="fas fa-helmet-battle"></i></div>
<h3 class="text-2xl font-bold mb-3">Sistema de Tier</h3>
<p class="text-gray-300">Equipamentos organizados em 7 tiers de poder. Colete conjuntos completos para bônus especiais.</p>
</div>
<!-- Feature 6 -->
<div class="bg-gray-700 rounded-xl p-6 transition duration-300 card-hover">
<div class="text-4xl mb-4 text-orange-500"><i class="fas fa-skull"></i></div>
<h3 class="text-2xl font-bold mb-3">Bosses Desafiadores</h3>
<p class="text-gray-300">Enfrente mais de 15 bosses com mecânicas únicas que exigem trabalho em equipe e estratégia para derrotar.</p>
</div>
</div>
</div>
</section>
<!-- Classes Section -->
<section id="classes" class="py-20 bg-gray-900">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<h2 class="text-4xl font-bold text-center mb-16 gradient-text">Classes Disponíveis</h2>
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-5 gap-6">
<!-- Warrior -->
<div class="bg-gray-800 rounded-lg overflow-hidden transition duration-300 card-hover">
<div class="h-48 bg-[url('https://i.imgur.com/WLQJ3rS.png')] bg-cover bg-center"></div>
<div class="p-6">
<h3 class="text-xl font-bold mb-2 text-red-400">Guerreiro</h3>
<p class="text-gray-400 mb-4">Mestre do combate corpo a corpo com alta resistência e dano.</p>
<div class="flex flex-wrap gap-2">
<span class="px-2 py-1 bg-red-900 rounded text-xs">Espadas</span>
<span class="px-2 py-1 bg-red-900 rounded text-xs">Armaduras Pesadas</span>
<span class="px-2 py-1 bg-red-900 rounded text-xs">Taunt</span>
</div>
</div>
</div>
<!-- Mage -->
<div class="bg-gray-800 rounded-lg overflow-hidden transition duration-300 card-hover">
<div class="h-48 bg-[url('https://i.imgur.com/5XJQZ9x.png')] bg-cover bg-center"></div>
<div class="p-6">
<h3 class="text-xl font-bold mb-2 text-blue-400">Mago</h3>
<p class="text-gray-400 mb-4">Manipulador de magias elementais com dano explosivo em área.</p>
<div class="flex flex-wrap gap-2">
<span class="px-2 py-1 bg-blue-900 rounded text-xs">Bastões</span>
<span class="px-2 py-1 bg-blue-900 rounded text-xs">Magias</span>
<span class="px-2 py-1 bg-blue-900 rounded text-xs">Teleporte</span>
</div>
</div>
</div>
<!-- Archer -->
<div class="bg-gray-800 rounded-lg overflow-hidden transition duration-300 card-hover">
<div class="h-48 bg-[url('https://i.imgur.com/3XJQZ9x.png')] bg-cover bg-center"></div>
<div class="p-6">
<h3 class="text-xl font-bold mb-2 text-green-400">Arqueiro</h3>
<p class="text-gray-400 mb-4">Especialista em ataques à distância com alta precisão.</p>
<div class="flex flex-wrap gap-2">
<span class="px-2 py-1 bg-green-900 rounded text-xs">Arcos</span>
<span class="px-2 py-1 bg-green-900 rounded text-xs">Armadilhas</span>
<span class="px-2 py-1 bg-green-900 rounded text-xs">Furtividade</span>
</div>
</div>
</div>
<!-- Assassin -->
<div class="bg-gray-800 rounded-lg overflow-hidden transition duration-300 card-hover">
<div class="h-48 bg-[url('https://i.imgur.com/7XJQZ9x.png')] bg-cover bg-center"></div>
<div class="p-6">
<h3 class="text-xl font-bold mb-2 text-purple-400">Assassino</h3>
<p class="text-gray-400 mb-4">Mestre da furtividade com ataques críticos devastadores.</p>
<div class="flex flex-wrap gap-2">
<span class="px-2 py-1 bg-purple-900 rounded text-xs">Adagas</span>
<span class="px-2 py-1 bg-purple-900 rounded text-xs">Venenos</span>
<span class="px-2 py-1 bg-purple-900 rounded text-xs">Invisibilidade</span>
</div>
</div>
</div>
<!-- Cleric -->
<div class="bg-gray-800 rounded-lg overflow-hidden transition duration-300 card-hover">
<div class="h-48 bg-[url('https://i.imgur.com/9XJQZ9x.png')] bg-cover bg-center"></div>
<div class="p-6">
<h3 class="text-xl font-bold mb-2 text-yellow-400">Clérigo</h3>
<p class="text-gray-400 mb-4">Curador e suporte com habilidades de proteção e buffs.</p>
<div class="flex flex-wrap gap-2">
<span class="px-2 py-1 bg-yellow-900 rounded text-xs">Cajados</span>
<span class="px-2 py-1 bg-yellow-900 rounded text-xs">Cura</span>
<span class="px-2 py-1 bg-yellow-900 rounded text-xs">Buffs</span>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Dungeons Section -->
<section id="dungeons" class="py-20 bg-gray-800">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<h2 class="text-4xl font-bold text-center mb-16 gradient-text">Dungeons Épicas</h2>
<div class="grid grid-cols-1 md:grid-cols-2 gap-8">
<!-- Dungeon 1 -->
<div class="bg-gray-700 rounded-xl overflow-hidden transition duration-300 card-hover">
<div class="h-64 bg-[url('https://i.imgur.com/4XJQZ9x.png')] bg-cover bg-center"></div>
<div class="p-6">
<h3 class="text-2xl font-bold mb-2 text-red-300">Templo do Dragão Negro</h3>
<p class="text-gray-300 mb-4">Um antigo templo corrompido pelo dragão sombrio Zarthax. Enfrente cultistas e desative os selos antes de confrontar o próprio dragão.</p>
<div class="flex justify-between items-center">
<div class="flex gap-2">
<span class="px-2 py-1 bg-gray-600 rounded text-xs">Nível 30+</span>
<span class="px-2 py-1 bg-gray-600 rounded text-xs">5 Jogadores</span>
</div>
<span class="text-yellow-400 font-bold">Recompensa: Armadura do Dragão</span>
</div>
</div>
</div>
<!-- Dungeon 2 -->
<div class="bg-gray-700 rounded-xl overflow-hidden transition duration-300 card-hover">
<div class="h-64 bg-[url('https://i.imgur.com/6XJQZ9x.png')] bg-cover bg-center"></div>
<div class="p-6">
<h3 class="text-2xl font-bold mb-2 text-blue-300">Cidadela dos Necromantes</h3>
<p class="text-gray-300 mb-4">Uma fortaleza flutuante onde necromantes realizam experimentos proibidos. Derrote hordas de mortos-vivos antes de confrontar o Arquinecromante Veylus.</p>
<div class="flex justify-between items-center">
<div class="flex gap-2">
<span class="px-2 py-1 bg-gray-600 rounded text-xs">Nível 25+</span>
<span class="px-2 py-1 bg-gray-600 rounded text-xs">3 Jogadores</span>
</div>
<span class="text-yellow-400 font-bold">Recompensa: Cajado da Alma</span>
</div>
</div>
</div>
<!-- Dungeon 3 -->
<div class="bg-gray-700 rounded-xl overflow-hidden transition duration-300 card-hover">
<div class="h-64 bg-[url('https://i.imgur.com/8XJQZ9x.png')] bg-cover bg-center"></div>
<div class="p-6">
<h3 class="text-2xl font-bold mb-2 text-green-300">Cavernas do Titã</h3>
<p class="text-gray-300 mb-4">Um labirinto de cavernas habitado por criaturas colossais. Resolva quebra-cabeças antigos para alcançar a câmara do Titã de Pedra.</p>
<div class="flex justify-between items-center">
<div class="flex gap-2">
<span class="px-2 py-1 bg-gray-600 rounded text-xs">Nível 40+</span>
<span class="px-2 py-1 bg-gray-600 rounded text-xs">4 Jogadores</span>
</div>
<span class="text-yellow-400 font-bold">Recompensa: Martelo do Titã</span>
</div>
</div>
</div>
<!-- Dungeon 4 -->
<div class="bg-gray-700 rounded-xl overflow-hidden transition duration-300 card-hover">
<div class="h-64 bg-[url('https://i.imgur.com/2XJQZ9x.png')] bg-cover bg-center"></div>
<div class="p-6">
<h3 class="text-2xl font-bold mb-2 text-purple-300">Abismo do Vazio</h3>
<p class="text-gray-300 mb-4">Um portal para uma dimensão de pura escuridão. Enfrente criaturas do vazio e impeça o Devorador de Mundos de entrar em seu plano.</p>
<div class="flex justify-between items-center">
<div class="flex gap-2">
<span class="px-2 py-1 bg-gray-600 rounded text-xs">Nível 50+</span>
<span class="px-2 py-1 bg-gray-600 rounded text-xs">6 Jogadores</span>
</div>
<span class="text-yellow-400 font-bold">Recompensa: Montaria do Vazio</span>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Equipment Showcase -->
<section class="py-20 bg-gray-900">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<h2 class="text-4xl font-bold text-center mb-16 gradient-text">Equipamentos Épicos</h2>
<div class="grid grid-cols-2 md:grid-cols-4 gap-6">
<!-- Sword -->
<div class="bg-gray-800 p-6 rounded-lg text-center transition duration-300 card-hover">
<img src="https://i.imgur.com/aXJQZ9x.png" alt="Espada" class="w-32 h-32 mx-auto mb-4 pixelated">
<h3 class="text-xl font-bold text-red-400 mb-2">Lâmina do Fênix</h3>
<p class="text-gray-400 text-sm">Tier 6 - Espada</p>
<div class="mt-4 text-yellow-400">
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
</div>
</div>
<!-- Armor -->
<div class="bg-gray-800 p-6 rounded-lg text-center transition duration-300 card-hover">
<img src="https://i.imgur.com/bXJQZ9x.png" alt="Armadura" class="w-32 h-32 mx-auto mb-4 pixelated">
<h3 class="text-xl font-bold text-blue-400 mb-2">Armadura Celestial</h3>
<p class="text-gray-400 text-sm">Tier 7 - Conjunto Completo</p>
<div class="mt-4 text-yellow-400">
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star-half-alt"></i>
</div>
</div>
<!-- Staff -->
<div class="bg-gray-800 p-6 rounded-lg text-center transition duration-300 card-hover">
<img src="https://i.imgur.com/cXJQZ9x.png" alt="Cajado" class="w-32 h-32 mx-auto mb-4 pixelated">
<h3 class="text-xl font-bold text-purple-400 mb-2">Cajado do Arcanjo</h3>
<p class="text-gray-400 text-sm">Tier 5 - Cajado Mágico</p>
<div class="mt-4 text-yellow-400">
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="far fa-star"></i>
</div>
</div>
<!-- Mount -->
<div class="bg-gray-800 p-6 rounded-lg text-center transition duration-300 card-hover">
<img src="https://i.imgur.com/dXJQZ9x.png" alt="Montaria" class="w-32 h-32 mx-auto mb-4 pixelated">
<h3 class="text-xl font-bold text-green-400 mb-2">Grifo Real</h3>
<p class="text-gray-400 text-sm">Montaria Épica</p>
<div class="mt-4 text-yellow-400">
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
</div>
</div>
</div>
</div>
</section>
<!-- Download Section -->
<section id="download" class="py-20 bg-gradient-to-r from-gray-800 to-gray-900">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="bg-gray-800 rounded-xl p-8 md:p-12 shadow-2xl">
<div class="grid grid-cols-1 md:grid-cols-2 gap-8 items-center">
<div>
<h2 class="text-4xl font-bold mb-6 gradient-text">Baixe Mythic Realms Agora!</h2>
<p class="text-xl mb-6">Transforme seu Minecraft Bedrock em uma experiência épica de RPG com dungeons, classes, bosses e muito mais!</p>
<div class="mb-8">
<h3 class="text-xl font-bold mb-4">Requisitos:</h3>
<ul class="space-y-2">
<li class="flex items-center"><i class="fas fa-check-circle text-green-500 mr-2"></i> Minecraft Bedrock 1.20+</li>
<li class="flex items-center"><i class="fas fa-check-circle text-green-500 mr-2"></i> 1GB de RAM livre (recomendado)</li>
<li class="flex items-center"><i class="fas fa-check-circle text-green-500 mr-2"></i> Experimental Gameplay ativado</li>
</ul>
</div>
<div class="flex flex-wrap gap-4">
<a href="#" class="px-6 py-3 bg-green-600 hover:bg-green-700 rounded-lg font-bold flex items-center">
<i class="fab fa-android mr-2"></i> Android
</a>
<a href="#" class="px-6 py-3 bg-blue-600 hover:bg-blue-700 rounded-lg font-bold flex items-center">
<i class="fab fa-windows mr-2"></i> Windows 10/11
</a>
<a href="#" class="px-6 py-3 bg-gray-600 hover:bg-gray-700 rounded-lg font-bold flex items-center">
<i class="fas fa-question mr-2"></i> Outras Plataformas
</a>
</div>
</div>
<div class="bg-gray-700 p-6 rounded-lg border-2 border-yellow-500">
<h3 class="text-2xl font-bold mb-4 text-center text-yellow-400">Atualização 2.1.0</h3>
<ul class="space-y-3">
<li class="flex items-start">
<i class="fas fa-plus-circle text-green-500 mr-2 mt-1"></i>
<span>Nova dungeon: Ruínas do Colosso</span>
</li>
<li class="flex items-start">
<i class="fas fa-plus-circle text-green-500 mr-2 mt-1"></i>
<span>2 novos bosses: Arauto do Caos e Rainha das Sombras</span>
</li>
<li class="flex items-start">
<i class="fas fa-plus-circle text-green-500 mr-2 mt-1"></i>
<span>5 conjuntos de armadura lendários adicionados</span>
</li>
<li class="flex items-start">
<i class="fas fa-bug-slash text-red-500 mr-2 mt-1"></i>
<span>Corrigido bug de progressão de classe</span>
</li>
<li class="flex items-start">
<i class="fas fa-balance-scale text-blue-500 mr-2 mt-1"></i>
<span>Balanceamento de magias do Mago</span>
</li>
</ul>
<div class="mt-6 text-center text-sm text-gray-400">
<i class="fas fa-history mr-1"></i> Última atualização: 15/06/2023
</div>
</div>
</div>
</div>
</div>
</section>
<!-- FAQ Section -->
<section class="py-20 bg-gray-800">
<div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8">
<h2 class="text-4xl font-bold text-center mb-16 gradient-text">Perguntas Frequentes</h2>
<div class="space-y-4">
<!-- FAQ Item 1 -->
<div class="bg-gray-700 rounded-lg overflow-hidden">
<button class="faq-btn w-full text-left p-4 flex justify-between items-center hover:bg-gray-600 transition">
<span class="font-bold">Como instalar o addon?</span>
<i class="fas fa-chevron-down transition-transform"></i>
</button>
<div class="faq-content hidden p-4 border-t border-gray-600">
<p>1. Baixe o arquivo .mcaddon<br>
2. Abra o arquivo com Minecraft (será importado automaticamente)<br>
3. Crie um novo mundo e ative o pack de comportamento<br>
4. Ative "Experimental Gameplay" nas configurações do mundo</p>
</div>
</div>
<!-- FAQ Item 2 -->
<div class="bg-gray-700 rounded-lg overflow-hidden">
<button class="faq-btn w-full text-left p-4 flex justify-between items-center hover:bg-gray-600 transition">
<span class="font-bold">Posso jogar com amigos?</span>
<i class="fas fa-chevron-down transition-transform"></i>
</button>
<div class="faq-content hidden p-4 border-t border-gray-600">
<p>Sim! Todos os jogadores precisam ter o addon instalado. Recomendamos jogar em um servidor dedicado para a melhor experiência com dungeons e bosses.</p>
</div>
</div>
<!-- FAQ Item 3 -->
<div class="bg-gray-700 rounded-lg overflow-hidden">
<button class="faq-btn w-full text-left p-4 flex justify-between items-center hover:bg-gray-600 transition">
<span class="font-bold">Como escolho minha classe?</span>
<i class="fas fa-chevron-down transition-transform"></i>
</button>
<div class="faq-content hidden p-4 border-t border-gray-600">
<p>Após criar o mundo, você receberá um livro especial no spawn. Use-o para selecionar sua classe. Você pode mudar de classe mais tarde, mas perderá parte do progresso.</p>
</div>
</div>
<!-- FAQ Item 4 -->
<div class="bg-gray-700 rounded-lg overflow-hidden">
<button class="faq-btn w-full text-left p-4 flex justify-between items-center hover:bg-gray-600 transition">
<span class="font-bold">O addon funciona em mundos existentes?</span>
<i class="fas fa-chevron-down transition-transform"></i>
</button>
<div class="faq-content hidden p-4 border-t border-gray-600">
<p>Sim, mas estruturas e dungeons só irão gerar em chunks não explorados. Para a melhor experiência, recomendamos um mundo novo.</p>
</div>
</div>
</div>
</div>
</section>
<!-- Footer -->
<footer class="bg-gray-900 py-12">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="grid grid-cols-1 md:grid-cols-3 gap-8">
<div>
<h3 class="text-xl font-bold mb-4 gradient-text medieval-font">Mythic Realms</h3>
<p class="text-gray-400">O addon definitivo de RPG para Minecraft Bedrock. Desenvolvido com paixão pela comunidade de Minecraft.</p>
<div class="mt-4 flex space-x-4">
<a href="#" class="text-gray-400 hover:text-white"><i class="fab fa-discord fa-lg"></i></a>
<a href="#" class="text-gray-400 hover:text-white"><i class="fab fa-youtube fa-lg"></i></a>
<a href="#" class="text-gray-400 hover:text-white"><i class="fab fa-twitter fa-lg"></i></a>
</div>
</div>
<div>
<h3 class="text-lg font-bold mb-4">Links Rápidos</h3>
<ul class="space-y-2">
<li><a href="#features" class="text-gray-400 hover:text-white transition">Recursos</a></li>
<li><a href="#classes" class="text-gray-400 hover:text-white transition">Classes</a></li>
<li><a href="#dungeons" class="text-gray-400 hover:text-white transition">Dungeons</a></li>
<li><a href="#download" class="text-gray-400 hover:text-white transition">Download</a></li>
</ul>
</div>
<div>
<h3 class="text-lg font-bold mb-4">Suporte</h3>
<ul class="space-y-2">
<li><a href="#" class="text-gray-400 hover:text-white transition">Documentação</a></li>
<li><a href="#" class="text-gray-400 hover:text-white transition">Reportar Bug</a></li>
<li><a href="#" class="text-gray-400 hover:text-white transition">Sugerir Ideias</a></li>
<li><a href="#" class="text-gray-400 hover:text-white transition">Perguntas Frequentes</a></li>
</ul>
</div>
</div>
<div class="mt-12 pt-8 border-t border-gray-800 text-center text-gray-500 text-sm">
<p>© 2023 Mythic Realms Addon. Não afiliado à Mojang ou Microsoft. Todos os direitos reservados.</p>
</div>
</div>
</footer>
<script>
// FAQ Accordion
document.querySelectorAll('.faq-btn').forEach(button => {
button.addEventListener('click', () => {
const content = button.nextElementSibling;
const icon = button.querySelector('i');
// Toggle content
content.classList.toggle('hidden');
// Rotate icon
icon.classList.toggle('rotate-180');
});
});
// Smooth scrolling for anchor links
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
anchor.addEventListener('click', function (e) {
e.preventDefault();l.
document.querySelector(this.getAttribute('href')).scrollIntoView({
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://enzostvs-deepsite.hf.space/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://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=TheKingss010/teste-addon" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
</html>