Reducir altura del slider en El Mundo tras mi Cristal

  • Autor Autor alexsaporta
  • Fecha de inicio Fecha de inicio
A

alexsaporta

Gamma
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Hola! Me estoy volviendo loco con el slider de la página El mundo tras mi cristal - Blog de viajes y fotografías -. me gustaría hacerlo menos alto. Los cambios que hago en la consola del navegador funcionan pero después cuando lo aplico al codigo nada de nada 🙁 Este es el codigo:

/* 13.1 Posts slider */
.armonioso-blog-posts-slider.container-fluid {
padding-left: 0;
padding-right: 0;
position: relative;
}
.armonioso-blog-posts-slider.container-fluid .row {
margin: 0;
}
.armonioso-blog-posts-slider.container-fluid .col-md-12 {
padding: 0;
}
.armonioso-post-list-wrapper {
background: #eeeeee url('img/slider-loading.gif') center center no-repeat;
height: 300px;
}
[MENTION=16931]medi[/MENTION]a (-webkit-min-device-pixel-ratio: 2) {
.armonioso-post-list-wrapper {
background-image: url("img/slider-loading@2x.gif");
background-size: 64px 64px;
}
}
.armonioso-blog-posts-slider {
margin-bottom: 45px;
}
.armonioso-post-list {

}
.armonioso-post-list.owl-carousel {
margin-left: 0;
margin-right: 0;
}
.armonioso-post-list .armonioso-post {
width: 100%;
float: left;
position: relative;
overflow: hidden;
}
.armonioso-post-list .armonioso-post .armonioso-post-image {
background: #d7d7d7;
height: 350px;
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
}
.armonioso-post-list .armonioso-post-image-wrapper {
height: 100%;
}
.armonioso-post-list .armonioso-post-details {
background: rgba(0, 0, 0, 0.5) none repeat scroll 0 0;
bottom: 0;
margin: 0;
padding: 15px 35px;
padding-top: 25px;
position: absolute;
top: auto;
width: 100%;
}
.armonioso-post-list .armonioso-post.armonioso-post-layout-vertical .armonioso-post-details {
bottom: 0;
top: 0;
right: 0;
left: auto;
width: 30%;
}
.armonioso-post-list .armonioso-post.armonioso-post-layout-vertical .armonioso-post-details .armonioso-post-description {
line-height: 22px;
}
.armonioso-post-list .armonioso-post.armonioso-post-layout-vertical .armonioso-post-details {
padding-top: 50px;
}
.armonioso-post-list .armonioso-post.armonioso-post-layout-vertical .armonioso-post-details .armonioso-post-title h2 {
font-size: 30px;
}
.armonioso-post-list .armonioso-post.armonioso-post-layout-vertical .armonioso-post-details .btn {
margin-top: 30px;
}
.armonioso-post-list .armonioso-post.armonioso-post-layout-vertical .armonioso-post-details .armonioso-post-description,
.armonioso-post-list .armonioso-post.armonioso-post-layout-vertical:hover .armonioso-post-details .armonioso-post-description {
height: auto;
}
.armonioso-post-list .armonioso-post-details .armonioso-post-category {
display: block;
color: #ffffff;
text-align: left;
margin: 0 auto;
margin-bottom: 0;
letter-spacing: 1px;
font-size: 10px;
text-transform: uppercase;
color: #fff;
position: relative;
line-height: 1.1;
}
.armonioso-post-list .armonioso-post-details .armonioso-post-description {
color: rgba(255,255,255,0.9);
text-align: left;
margin-top: 15px;
margin-bottom: 5px;
overflow: hidden;
line-height: 19px;
height: 0;
}
.armonioso-post-list .armonioso-post:hover .armonioso-post-details .armonioso-post-description {
height: 40px;
}
.armonioso-post-list .armonioso-post-details .armonioso-post-category {
color: rgba(255,255,255,0.5);
}
.armonioso-post-list .armonioso-post-details .armonioso-post-category a {
color: rgba(255,255,255,0.5);
text-decoration: none;
}
.armonioso-post-list .armonioso-post-details .armonioso-post-title h2 {
font-size: 18px;
color: #ffffff;
margin: 0 auto;
margin-bottom: 10px;
text-align: left;
display: block;
}
.armonioso-post-list .armonioso-post-details .armonioso-post-title a {
text-decoration: none;
}
.armonioso-post-list .armonioso-post-details .armonioso-post-title h2:hover {
opacity: 0.8;
}
.armonioso-post-list .armonioso-post-details .armonioso-post-date {
font-size: 12px;
text-transform: uppercase;
color: #ffffff;
text-align: left;
margin-bottom: 10px;
background: #76a5cd;
padding: 0px 8px;
display: inline-block;
 
Hola, para cambiar el grosor del slider habría que editar en span que va dentro de owl-dot y cambiarle el height por el que quieras. Eso está en la línea 688 del css autoptimize_2dcfc..:

body .owl-theme .owl-dots .owl-dot span {
background: #d9d9d9 none repeat scroll 0 0;
border-right: 1px solid #fff;
display: block;
height: 15px; <---- Esto habría que cambiar
transition: opacity 200ms ease 0s;
width: 100%;
}

El problema que surge después es que ya no queda justo en el borde inferior. Eso se soluciona fácilmente cambiando el line-height de la clase .owl-controls.
 
Atrás
Arriba