Página principal: mudanças entre as edições
De ForFans
Mais ações
Sem resumo de edição |
Sem resumo de edição |
||
| Linha 1: | Linha 1: | ||
<html> | <html> | ||
<!-- BANNER PRINCIPAL HERO (COM LINHA 100VW INTEGRADA NO FUNDO) --> | <!-- BANNER PRINCIPAL HERO (COM LINHA 100VW INTEGRADA NO FUNDO - AGORA COM 8PX) --> | ||
<div style="background:#1a0a2e;background-image:radial-gradient(circle at 20% 50%, #2d1b69 0%, transparent 50%),radial-gradient(circle at 80% 20%, #4a1942 0%, transparent 40%),radial-gradient(circle at 50% 100%, #1a0a2e 0%, transparent 60%);padding:40px 20px;text-align:center;margin:-20px -20px 0 -20px;position:relative;overflow:hidden;width:100vw;margin-left:calc(-50vw + 50%); border-bottom: | <div style="background:#1a0a2e;background-image:radial-gradient(circle at 20% 50%, #2d1b69 0%, transparent 50%),radial-gradient(circle at 80% 20%, #4a1942 0%, transparent 40%),radial-gradient(circle at 50% 100%, #1a0a2e 0%, transparent 60%);padding:40px 20px;text-align:center;margin:-20px -20px 0 -20px;position:relative;overflow:hidden;width:100vw;margin-left:calc(-50vw + 50%); border-bottom: 8px solid #e63a5a;"> | ||
<div style="position:absolute;top:10%;left:5%;width:15px;height:15px;background:#e63a5a;transform:rotate(45deg);opacity:0.6;"></div> | <div style="position:absolute;top:10%;left:5%;width:15px;height:15px;background:#e63a5a;transform:rotate(45deg);opacity:0.6;"></div> | ||
<div style="position:absolute;top:30%;left:15%;width:8px;height:8px;background:#f59e0b;transform:rotate(45deg);opacity:0.5;"></div> | <div style="position:absolute;top:30%;left:15%;width:8px;height:8px;background:#f59e0b;transform:rotate(45deg);opacity:0.5;"></div> | ||
| Linha 20: | Linha 20: | ||
</div> | </div> | ||
<!-- SEÇÃO DE CATEGORIAS ( | <!-- SEÇÃO DE CATEGORIAS (ALINHAMENTO FIXADO NO TOPO PARA NÃO DESCENTRALIZAR) --> | ||
<div style="margin-bottom: 32px; display: flex; align-items: | <div style="margin-bottom: 32px; display: flex; align-items: flex-start; justify-content: flex-start; position: relative; z-index: 10;"> | ||
<!-- Aba | <!-- Aba com margin-top de -8px e borda de 8px cravados para cobrir a linha perfeitamente --> | ||
<div style="background: #e63a5a; color: white; padding: 6px 20px; font-weight: 700; font-size: 13px; text-transform: uppercase; letter-spacing: 1px; border-radius: 0 0 6px 6px; display: inline-flex; align-items: center; box-shadow: 0 2px 4px rgba(0,0,0,0.15);"> | <div style="background: #e63a5a; color: white; padding: 6px 20px; font-weight: 700; font-size: 13px; text-transform: uppercase; letter-spacing: 1px; border-radius: 0 0 6px 6px; display: inline-flex; align-items: center; box-shadow: 0 2px 4px rgba(0,0,0,0.15); margin-top: -8px; border-top: 8px solid #2d1b69; box-sizing: border-box;"> | ||
Categorias | Categorias | ||
</div> | </div> | ||
<!-- Link Lateral "Ver Todas" | <!-- Link Lateral "Ver Todas" ajustado para acompanhar a altura do texto perfeitamente --> | ||
<a href="/Special:Categories" style="color: #666; text-decoration: none; font-size: 11px; font-weight: 700; text-transform: uppercase; margin-left: 14px; margin-top: | <a href="/Special:Categories" style="color: #666; text-decoration: none; font-size: 11px; font-weight: 700; text-transform: uppercase; margin-left: 14px; margin-top: 8px; transition: color 0.2s ease; letter-spacing: 0.5px;" onmouseover="this.style.color='#e63a5a'" onmouseout="this.style.color='#666'"> | ||
Ver todas ❯ | Ver todas ❯ | ||
</a> | </a> | ||