📖 Introdução
GaloDoido.css é um framework CSS extremista que força qualquer página web a adotar a identidade visual do Clube Atlético Mineiro: Preto e Branco absolutos.
Inspirado no mascote caótico Galo Doido e na paixão da Massa Atleticana,
este framework usa !important em TODAS as regras para garantir domínio total.
Características Principais
- 🎨 Ditadura P&B: Apenas preto (#000000) e branco (#FFFFFF)
- 🐓 Cursor Galo Doido: Mascote substituindo cursor padrão
- 🚫 Bloqueio Rival: Esconde elementos com "blue", "cruzeiro", "maria"
- 🏟️ Locais Sagrados: Destaque especial para estádios do Galo
- ⚡ Efeito Bicada: Links invertem cores no hover (rápido!)
- 🖼️ Filtro Grayscale: Todas imagens em P&B (exceto .galo-oficial)
🎨 Regra 1: Ditadura das Cores
TODO elemento é forçado a ser preto ou branco. Sem exceções. Sem negociação.
ANTES (Colorido)
Texto vermelho
Texto azul
Texto verde
DEPOIS (Galoizado)
Texto vermelho → BRANCO
Texto azul → BRANCO
Texto verde → BRANCO
/* Seletor Universal */
* {
color: white !important;
background-color: black !important;
border-color: white !important;
}
🐓 Regra 2: Cursor Personalizado
O cursor do mouse é substituído pela imagem do Galo Doido. Mova o mouse pela página para ver o efeito!
👆 Mova o mouse aqui para ver o cursor Galo Doido!
* {
cursor: url('assets/galo-cursor.png'), auto !important;
}
🔗 Regra 3: Links - Efeito Bicada
Links não visitados são brancos. Links visitados ficam cinza (luto pelos rivais). No hover, as cores invertem rapidamente simulando uma bicada!
Teste os links abaixo:
a:hover {
color: black !important;
background-color: white !important;
transition: all 0.15s ease-in-out !important;
}
🖼️ Regra 4: Filtro Grayscale
Todas as imagens são convertidas para escala de cinza (P&B).
Apenas imagens com a classe .galo-oficial mantêm as cores.
Imagem Normal
Fica em P&B
Imagem .galo-oficial
Mantém cores (se fosse <img>)
img:not(.galo-oficial) {
filter: grayscale(100%) contrast(120%) !important;
}
🚫 Regra 5: Bloqueio de Rivais
Qualquer elemento com class ou id contendo
"blue", "cruzeiro", "maria" é ESCONDIDO!
Teste de Bloqueio:
✅ Este parágrafo aparece normalmente
❌ Este parágrafo tem class="blue-text" - FOI BLOQUEADO!
❌ Este tem id="cruzeiro-logo" - SÉRIE B!
✅ Este parágrafo também aparece
Nota: Os elementos bloqueados estão no HTML mas invisíveis!
[class*="blue"],
[class*="cruzeiro"],
[id*="maria"] {
display: none !important;
visibility: hidden !important;
}
🏟️ Regra 6: Locais Sagrados
Elementos com IDs de estádios históricos do Galo recebem destaque especial: borda grossa, negrito, maiúsculas.
Mineirão
Gigante da Pampulha - Casa do Galo desde 1965
Independência
Palco de glórias atleticanas no Horto
Arena MRV
Nova casa do Galo - Estado da arte
Horto
⚡ Local do MILAGRE - Libertadores 2013 ⚡
#mineirao, #independencia, #arena-mrv, #horto {
border: 5px solid white !important;
font-weight: 900 !important;
text-transform: uppercase !important;
}
🧩 Componentes Demonstrativos
Botões
Formulário
Tabela
| Título | Ano | Local |
|---|---|---|
| Libertadores | 2013 | Mineirão |
| Brasileiro | 1971 | Mineirão |
| Brasileiro | 2021 | Arena MRV |
Código
Código inline: const galo = "forte vingador";
function euAcredito() {
return "Aqui é Galo!";
}
📦 Instalação e Uso
Método 1: Link Direto (Recomendado)
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="galodoido.css">
</head>
<body>
<h1>Aqui é Galo!</h1>
</body>
</html>
Método 2: Injeção Troll (Bookmarklet)
Para "galoizar" qualquer site, use este snippet JavaScript:
// Cole no console do navegador ou crie um bookmarklet
javascript:(function(){
var link = document.createElement('link');
link.rel = 'stylesheet';
link.href = 'https://leonardocouy.github.io/galo-css/galodoido.css';
document.head.appendChild(link);
alert('Site GALOIZADO! Aqui é Galo! 🐓');
})();
Método 3: Import CSS
@import url('galodoido.css');
Exceções (Se Necessário)
Para preservar cores em imagens oficiais do Galo:
<img src="escudo-galo.png" class="galo-oficial" alt="Escudo do Galo">
GaloDoido.css