Nexos/cnt-sindikatua
3
1
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects 1 Releases Wiki Activity

add media queries img portada

Browse Source
This commit is contained in:
Gustavo
2026-03-03 09:33:33 +00:00
parent c750a4f969
commit 955acc93f7
1 changed files with 107 additions and 70 deletions
Download Patch File Download Diff File Expand all files Collapse all files

177
style.css
View File

@@ -5,13 +5,13 @@
*/
:root {
--rojo-cnt: #dc2d30;
--rojo-cnt-dark: #9d1b1d;
--rojo-cnt-light: #d6453f;
--bs-subtle: #f8d7da;
--reset: #7b7b7b;
--white:#fff;
--black:#000000ff;
--rojo-cnt: #dc2d30;
--rojo-cnt-dark: #9d1b1d;
--rojo-cnt-light: #d6453f;
--bs-subtle: #f8d7da;
--reset: #7b7b7b;
--white: #fff;
--black: #000000ff;
}
@font-face {
@@ -23,7 +23,7 @@
}
body {
min-height: 100vh;
min-height: 100vh;
}
/* PORTADA -> ENLACES */
@@ -96,7 +96,7 @@ button[type="reset"] {
/* Botón Disabled */
.btn-disabled-cnt {
border-radius: 10px !important;
border:2px solid var(--bs-subtle);
border: 2px solid var(--bs-subtle);
color: var(--white);
padding: 10px;
font-size: 16px;
@@ -108,8 +108,8 @@ button[type="reset"] {
/* reducir tamaño botones */
.btn-xs {
padding: 0.60rem 0.9rem;
font-size: 0.7rem;
padding: 0.60rem 0.9rem;
font-size: 0.7rem;
}
/* Quitar el focus/active de todos los elementos del menú */
@@ -127,24 +127,24 @@ button[type="reset"] {
}
/* PORTADA -> Titles */
.sp-module-title::after{
background: var(--rojo-cnt);
content: "";
height: 3px;
left: 0;
position: absolute;
bottom: -5px;
width: 150px;
.sp-module-title::after {
background: var(--rojo-cnt);
content: "";
height: 3px;
left: 0;
position: absolute;
bottom: -5px;
width: 150px;
}
.sp-module-title::before{
background: var(--black);
content: "";
height: 3px;
left: 0;
position: absolute;
bottom: -12px;
width: 150px;
.sp-module-title::before {
background: var(--black);
content: "";
height: 3px;
left: 0;
position: absolute;
bottom: -12px;
width: 150px;
}
/* HEADER sindikatua */
@@ -163,7 +163,7 @@ button[type="reset"] {
/* menu-burger */
.menu-burger .offcanvas {
background: linear-gradient(135deg,rgba(204,29,26,0.9),#cc1d1a);
background: linear-gradient(135deg, rgba(204, 29, 26, 0.9), #cc1d1a);
}
.menu-burger .dropdown:hover .dropdown-menu {
@@ -183,7 +183,8 @@ button[type="reset"] {
/* PORTADA -> CARDS recent posts 'noticias' */
.page-portada .recent-posts .card-img-overlay {
top: auto !important; /* Anula el top: 0 por defecto de Bootstrap */
top: auto !important;
/* Anula el top: 0 por defecto de Bootstrap */
bottom: 0;
height: 30%;
background: rgba(128, 128, 128, 0.8);
@@ -193,14 +194,39 @@ button[type="reset"] {
/* PORTADA -> imagen noticia principal */
.page-portada .recent-posts .img-noticias {
width: 100%;
height: 100%;
object-fit: cover;
width: 100%;
height: 100%;
object-fit: cover;
}
@media (width > 1401px) {
.page-portada .recent-posts .img-noticias {
max-height: 500px;
}
}
@media (min-width: 1201px) and (max-width: 1400px) {
.page-portada .recent-posts .img-noticias {
max-height: 400px;
}
}
@media (min-width: 992px) and (max-width: 1200px) {
.page-portada .recent-posts .img-noticias {
max-height: 350px;
}
}
@media (min-width: 769px) and (max-width: 991px) {
.page-portada .recent-posts .img-noticias {
max-height: 250px;
}
}
/* PORTADA -> CARDS OPINION */
.page-portada .opinion-article .card-img-overlay {
top: auto !important; /* Anula el top: 0 por defecto de Bootstrap */
top: auto !important;
/* Anula el top: 0 por defecto de Bootstrap */
bottom: 0;
height: auto;
background: rgba(128, 128, 128, 0.8);
@@ -209,7 +235,7 @@ button[type="reset"] {
}
.page-portada .opinion-article .card-img-overlay:hover,
.page-portada .recent-posts .card-img-overlay:hover {
.page-portada .recent-posts .card-img-overlay:hover {
background: rgba(0, 0, 0, 0.8);
}
@@ -225,14 +251,15 @@ button[type="reset"] {
}
}
.page-portada .recent-posts .card-title,
.page-portada .recent-posts .card-title,
.page-portada .opinion-article .card-title {
color: var(--white);
margin: 0;
font-weight: 600;
text-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
display: -webkit-box;
-webkit-line-clamp: 2; /* Número de líneas */
-webkit-line-clamp: 2;
/* Número de líneas */
-webkit-box-orient: vertical;
overflow: hidden;
white-space: nowrap;
@@ -240,10 +267,11 @@ button[type="reset"] {
}
.page-portada .opinion-article .card-title {
-webkit-line-clamp: 1; /* Número de líneas */
-webkit-line-clamp: 1;
/* Número de líneas */
}
.page-portada .recent-posts .card-title a,
.page-portada .recent-posts .card-title a,
.page-portada .opinion-article .card-title a {
color: var(--white);
text-decoration: none;
@@ -262,13 +290,14 @@ button[type="reset"] {
.page-portada .recent-posts .card-img-overlay {
height: 18%;
}
.page-portada .recent-posts .card-title {
font-size: 0.9rem;
}
.page-portada .recent-posts .media-mb {
margin-bottom: 0.5rem;
}
margin-bottom: 1.7rem !important;
}
}
/* PORTADA -> ENLACES */
@@ -293,14 +322,14 @@ button[type="reset"] {
/* PORTADA -> SECTION VIDEO */
.video-iframe {
border-radius: 0.5rem;
overflow: hidden;
border-radius: 0.5rem;
overflow: hidden;
}
/* PORTADA -> SECTION CAMPAÑA */
.section-campana-conflictos .card-img-fixed {
min-height: 300px;
max-height: 300px;
min-height: 300px;
max-height: 300px;
object-fit: cover;
width: 100%;
}
@@ -321,7 +350,7 @@ button[type="reset"] {
height: 100%;
width: 100%;
object-fit: contain;
object-position: center;
object-position: center;
}
.hover-title-text:hover {
@@ -377,8 +406,8 @@ button[type="reset"] {
.enlaces button:focus,
.enlaces button:active {
outline: none;
box-shadow: none;
outline: none;
box-shadow: none;
}
.section-footer {
@@ -403,7 +432,8 @@ button[type="reset"] {
/* Formulario centrado */
.formulario-contacto .wpcf7-form {
width: 100%;
max-width: 500px; /* Ajusta según necesites */
max-width: 500px;
/* Ajusta según necesites */
margin: 0 auto;
}
@@ -415,7 +445,8 @@ button[type="reset"] {
.formulario-contacto input[type="number"],
.formulario-contacto textarea,
.formulario-contacto select {
border-radius: 25px !important; /* Bordes redondos */
border-radius: 25px !important;
/* Bordes redondos */
border: 2px solid #e9ecef !important;
padding: 12px 20px !important;
font-size: 16px;
@@ -517,11 +548,11 @@ button[type="reset"] {
.formulario-contacto {
padding: 15px;
}
.formulario-contacto .wpcf7-form {
max-width: 100%;
}
.formulario-contacto input[type="submit"] {
font-size: 16px;
padding: 12px 25px;
@@ -532,34 +563,37 @@ button[type="reset"] {
* Animación en hover.
*/
.link-underline-animate {
position: relative;
text-decoration: none;
transition: color 0.3s ease;
position: relative;
text-decoration: none;
transition: color 0.3s ease;
}
.link-underline-animate::after {
content: "";
position: absolute;
bottom: 0;
left: 50%;
width: 0;
height: 2px;
background-color: var(--rojo-cnt); /* color del subrayado */
transition: all 0.3s ease;
transform: translateX(-50%);
content: "";
position: absolute;
bottom: 0;
left: 50%;
width: 0;
height: 2px;
background-color: var(--rojo-cnt);
/* color del subrayado */
transition: all 0.3s ease;
transform: translateX(-50%);
}
.link-underline-animate:hover {
color: var(--rojo-cnt) !important; /* color del texto al hacer hover */
color: var(--rojo-cnt) !important;
/* color del texto al hacer hover */
}
.link-underline-animate:hover::after {
width: 100%;
width: 100%;
}
/* SEARCH PAGE */
.offcanvas-body {
height: 18vh!important; /* altura del 18% del viewport */
height: 18vh !important;
/* altura del 18% del viewport */
}
/* PAGINACIÓN */
@@ -570,7 +604,8 @@ button[type="reset"] {
.pagination-block .page-item {
display: flex;
align-items: center;
margin: 0; /* Resetear margin por defecto */
margin: 0;
/* Resetear margin por defecto */
}
/* Estilos específicos para números de página */
@@ -585,7 +620,8 @@ button[type="reset"] {
}
.current-page {
border-radius: 75px !important; /* Mismo border-radius que activos */
border-radius: 75px !important;
/* Mismo border-radius que activos */
}
.btn-pagination-position {
@@ -612,4 +648,5 @@ button[type="reset"] {
a.btn-page-hover:hover {
border: 2px solid var(--black) !important;
}
/* END PAGINACIÓN */
/* END PAGINACIÓN */