MediaWiki:Common.css: Difference between revisions
Appearance
imported>Raccoonccity No edit summary |
imported>Raccoonccity No edit summary |
||
| Line 25: | Line 25: | ||
.slide-in { | .slide-in { | ||
opacity: 0; | opacity: 0; | ||
transform: translateX(-100%); | transform: translateX(-100%); /* Comienza fuera de la pantalla a la izquierda */ | ||
transition: transform 0.5s ease, opacity 0.5s ease; | transition: transform 0.5s ease, opacity 0.5s ease; | ||
} | } | ||
| Line 31: | Line 31: | ||
.slide-in.visible { | .slide-in.visible { | ||
opacity: 1; | opacity: 1; | ||
transform: translateX(0); | transform: translateX(0); /* Se desliza hacia su posición original */ | ||
} | |||
/* Aplica la animación a los elementos cuando se vean */ | |||
body { | |||
padding: 50px; | |||
background-color: #f4f4f4; | |||
} | |||
.container { | |||
background-color: #fff; | |||
padding: 20px; | |||
border-radius: 10px; | |||
box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1); | |||
width: 300px; | |||
} | } | ||
Revision as of 15:40, 26 December 2025
/* CSS placed here will be applied to all skins */
body {
cursor: url('https://static.wikia.nocookie.net/digimon-w0rld/images/b/b0/Agucur.png/revision/latest?cb=20251226151433'), auto;
}
img:hover {
transform: scale(1.1); /* Aumenta el tamaño de la imagen un 10% */
transition: transform 0.3s ease-in-out; /* Hace que el zoom sea suave */
}
.button {
background-color: #ff6600;
color: white;
padding: 10px 20px;
border-radius: 5px;
text-align: center;
transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.button:hover {
transform: translateY(-5px); /* Eleva el botón al pasar el mouse */
box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.2); /* Sombra más intensa */
}
.slide-in {
opacity: 0;
transform: translateX(-100%); /* Comienza fuera de la pantalla a la izquierda */
transition: transform 0.5s ease, opacity 0.5s ease;
}
.slide-in.visible {
opacity: 1;
transform: translateX(0); /* Se desliza hacia su posición original */
}
/* Aplica la animación a los elementos cuando se vean */
body {
padding: 50px;
background-color: #f4f4f4;
}
.container {
background-color: #fff;
padding: 20px;
border-radius: 10px;
box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
width: 300px;
}