MediaWiki:Citizen.css: mudanças entre as edições
Página de Interface do MediaWiki
Mais ações
Sem resumo de edição |
Sem resumo de edição |
||
| Linha 1: | Linha 1: | ||
/* ====================================================================== | /* ====================================================================== | ||
ANIMAÇÃO HOME -> HOME ( | ANIMAÇÃO HOME -> HOME (TAMANHO AJUSTADO E AMPLIADO) | ||
====================================================================== */ | ====================================================================== */ | ||
| Linha 19: | Linha 19: | ||
min-width: 32px !important; | min-width: 32px !important; | ||
min-height: 32px !important; | min-height: 32px !important; | ||
background-image: none !important; | background-image: none !important; | ||
} | } | ||
/* 3. Injeta a casinha SÓLIDA | /* 3. Injeta a casinha SÓLIDA com tamanho maior */ | ||
.citizen-header__logo::before { | .citizen-header__logo::before { | ||
content: "" !important; | content: "" !important; | ||
| Linha 29: | Linha 29: | ||
left: 50% !important; | left: 50% !important; | ||
transform: translate(-50%, -50%) !important; | transform: translate(-50%, -50%) !important; | ||
width: | |||
height: | /* ================================================================== | ||
REGULAGEM DE TAMANHO: Se quiser maior ou menor, mude os dois valores abaixo | |||
================================================================== */ | |||
width: 24px !important; | |||
height: 24px !important; | |||
/* ================================================================== */ | |||
background-color: currentColor !important; | background-color: currentColor !important; | ||
/* | /* SVG: Casinha totalmente preenchida/sólida */ | ||
-webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z'/></svg>") no-repeat center !important; | -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z'/></svg>") no-repeat center !important; | ||
mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z'/></svg>") no-repeat center !important; | mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z'/></svg>") no-repeat center !important; | ||
| Linha 39: | Linha 45: | ||
-webkit-mask-size: contain !important; | -webkit-mask-size: contain !important; | ||
mask-size: contain !important; | mask-size: contain !important; | ||
opacity: 0.65 !important; | opacity: 0.65 !important; | ||
transition: opacity 0.2s ease, transform 0.2s ease !important; | transition: opacity 0.2s ease, transform 0.2s ease !important; | ||
} | } | ||
Edição das 23h30min de 16 de junho de 2026
/* ======================================================================
ANIMAÇÃO HOME -> HOME (TAMANHO AJUSTADO E AMPLIADO)
====================================================================== */
/* 1. Esconde a imagem do logo original em todas as tags possíveis */
.citizen-header__logo img,
.citizen-header__logo-image,
.mw-logo-wordmark,
.mw-logo-icon {
display: none !important;
}
/* 2. Limpa o fundo do contêiner para o logo redondo sumir de vez */
.citizen-header__logo {
position: relative !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
min-width: 32px !important;
min-height: 32px !important;
background-image: none !important;
}
/* 3. Injeta a casinha SÓLIDA com tamanho maior */
.citizen-header__logo::before {
content: "" !important;
position: absolute !important;
top: 50% !important;
left: 50% !important;
transform: translate(-50%, -50%) !important;
/* ==================================================================
REGULAGEM DE TAMANHO: Se quiser maior ou menor, mude os dois valores abaixo
================================================================== */
width: 24px !important;
height: 24px !important;
/* ================================================================== */
background-color: currentColor !important;
/* SVG: Casinha totalmente preenchida/sólida */
-webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z'/></svg>") no-repeat center !important;
mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z'/></svg>") no-repeat center !important;
-webkit-mask-size: contain !important;
mask-size: contain !important;
opacity: 0.65 !important;
transition: opacity 0.2s ease, transform 0.2s ease !important;
}
/* 4. Transição controlada para o Hover do tema assumir */
.citizen-header:hover .citizen-header__logo::before,
.citizen-header__start:hover .citizen-header__logo::before,
.citizen-header__logo:hover::before {
opacity: 0 !important;
transform: translate(-50%, -50%) scale(0.8) !important;
}
/* 5. Seus ajustes originais da barra lateral */
.citizen-drawer {
width: 30px !important;
}
.citizen-nav {
font-size: 15px !important;
}
.citizen-nav__item {
padding: 10px 16px !important;
}