Diferencia entre revisiones de «MediaWiki:Common.css»
Ir a la navegación
Ir a la búsqueda
Sin resumen de edición |
Sin resumen de edición |
||
Línea 59: | Línea 59: | ||
/* Estilo para videos responsivos */ | /* Estilo para videos responsivos */ | ||
.video- | .video-group { | ||
display: flex; | |||
flex-direction: column; | |||
align-items: center; | |||
} | |||
.video-group iframe, | |||
.video-group object, | |||
.video-group embed { | |||
position: relative; | position: relative; | ||
width: 100%; | |||
height: 0; | |||
padding-bottom: 56.25%; /* 16:9 ratio */ | padding-bottom: 56.25%; /* 16:9 ratio */ | ||
margin-bottom: 20px; /* Espacio entre los videos */ | |||
overflow: hidden; | overflow: hidden; | ||
} | } | ||
.video- | .video-group iframe, | ||
.video- | .video-group object, | ||
.video- | .video-group embed { | ||
position: absolute; | position: absolute; | ||
top: 0; | top: 0; |
Revisión del 11:05 4 ago 2024
/* Los estilos CSS colocados aquí se aplicarán a todas las apariencias */
/* TOC escondida en todas las vistas */
.toc, #toc { display: none; }
/* Estilos para dispositivos móviles */
@media screen and (max-width: 767px) {
.mobile-only {
display: block;
}
.nomobile {
display: none;
}
}
/* Estilos para dispositivos de escritorio */
@media screen and (min-width: 768px) {
.mobile-only {
display: none;
}
.nomobile {
display: block;
}
}
/* Estilo cuadrados Página Principal */
.square-container {
margin: 0 auto;
width: 90%;
text-align: center;
margin-bottom: 15px;
}
.square {
border-radius: 16px;
padding: 25px;
background-color: #f1d7ff;
margin: 0;
border: none;
width: 200px; /* Ancho fijo para todos los cuadrados */
height: 80px; /* Altura fija para todos los cuadrados */
}
.square-mobile-container {
margin: 0 auto;
width: 90%;
text-align: center;
margin-bottom: 15px;
}
.square-mobile {
border-radius: 16px;
padding: 25px;
background-color: #f1d7ff;
margin: 0;
border: none;
width: 120px; /* Ancho fijo para todos los cuadrados */
height: 80px; /* Altura fija para todos los cuadrados */
}
/* Estilo para videos responsivos */
.video-group {
display: flex;
flex-direction: column;
align-items: center;
}
.video-group iframe,
.video-group object,
.video-group embed {
position: relative;
width: 100%;
height: 0;
padding-bottom: 56.25%; /* 16:9 ratio */
margin-bottom: 20px; /* Espacio entre los videos */
overflow: hidden;
}
.video-group iframe,
.video-group object,
.video-group embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}