MediaWiki:Common.css: mudanças entre as edições
De Sweet
Sem resumo de edição |
Sem resumo de edição |
||
| Linha 1: | Linha 1: | ||
/** | /** ========================================================= | ||
/* Zoom de | * Estilos globais (aplicam em todos os temas) | ||
* =======================================================*/ | |||
/* Zoom suave para qualquer imagem dentro de .btn-zoom */ | |||
.btn-zoom img { | .btn-zoom img { | ||
transition: transform 120ms ease, box-shadow 120ms ease, filter 120ms ease; | transition: transform 120ms ease, box-shadow 120ms ease, filter 120ms ease; | ||
transform-origin: center center; | transform-origin: center center; | ||
} | } | ||
.btn-zoom:hover img { | .btn-zoom:hover img { | ||
transform: scale(1.08); | transform: scale(1.08); | ||
| Linha 11: | Linha 13: | ||
filter: saturate(1.05); | filter: saturate(1.05); | ||
} | } | ||
/* | |||
.overlay- | /* ===== Botão sobreposto (imagem sobre imagem) ===== */ | ||
/* Container opcional (caso queira usar em vez de inline style) */ | |||
.overlay-wrapper { | |||
position: relative; | |||
display: inline-block; | |||
} | } | ||
/* | |||
/* Reset visual da imagem-botão + mesmo zoom do .btn-zoom */ | |||
.overlay-btn img { | .overlay-btn img { | ||
display: block; | |||
border: none !important; | border: none !important; | ||
background: transparent !important; | background: transparent !important; | ||
| Linha 24: | Linha 30: | ||
transition: transform 120ms ease, box-shadow 120ms ease, filter 120ms ease; | transition: transform 120ms ease, box-shadow 120ms ease, filter 120ms ease; | ||
transform-origin: center center; | transform-origin: center center; | ||
cursor: pointer; | |||
} | } | ||
.overlay-btn:hover img { | .overlay-btn:hover img { | ||
transform: scale(1.08); | transform: scale(1.08); | ||
box-shadow: 0 6px 18px rgba(0,0,0,.25); | box-shadow: 0 6px 18px rgba(0,0,0,.25); | ||
filter: saturate(1.05); | filter: saturate(1.05); | ||
} | |||
/* Efeito de “pressionado” ao clicar */ | |||
.overlay-btn:active img { | |||
transform: scale(1.03); | |||
box-shadow: 0 2px 8px rgba(0,0,0,.25); | |||
} | } | ||
Edição das 13h57min de 7 de setembro de 2025
/** =========================================================
* Estilos globais (aplicam em todos os temas)
* =======================================================*/
/* Zoom suave para qualquer imagem dentro de .btn-zoom */
.btn-zoom img {
transition: transform 120ms ease, box-shadow 120ms ease, filter 120ms ease;
transform-origin: center center;
}
.btn-zoom:hover img {
transform: scale(1.08);
box-shadow: 0 6px 18px rgba(0,0,0,.25);
filter: saturate(1.05);
}
/* ===== Botão sobreposto (imagem sobre imagem) ===== */
/* Container opcional (caso queira usar em vez de inline style) */
.overlay-wrapper {
position: relative;
display: inline-block;
}
/* Reset visual da imagem-botão + mesmo zoom do .btn-zoom */
.overlay-btn img {
display: block;
border: none !important;
background: transparent !important;
box-shadow: none !important;
transition: transform 120ms ease, box-shadow 120ms ease, filter 120ms ease;
transform-origin: center center;
cursor: pointer;
}
.overlay-btn:hover img {
transform: scale(1.08);
box-shadow: 0 6px 18px rgba(0,0,0,.25);
filter: saturate(1.05);
}
/* Efeito de “pressionado” ao clicar */
.overlay-btn:active img {
transform: scale(1.03);
box-shadow: 0 2px 8px rgba(0,0,0,.25);
}
