Move carousel arrows out of the way on mobile

Carrousels have a first slide that is mostly text without any background color,
and on mobile the arrows looked like where “erasing” the text.
This commit is contained in:
oriol carbonell pujolàs 2024-02-02 02:38:31 +01:00
parent 0b93a4c989
commit 5e053034a5
1 changed files with 15 additions and 0 deletions

View File

@ -635,6 +635,21 @@ dl, .nature > div, .outside_activities > div, .campsite_info {
z-index: 1; z-index: 1;
} }
@media (max-width: 48rem) {
.carousel .slick-arrow {
background: var(--accent);
margin-top: -6rem;
margin-right: -1rem;
}
.carousel .slick-list {
margin-right: -5rem;
padding-top: 2rem;
}
}
.slick-slider .slick-prev { .slick-slider .slick-prev {
right: 6rem; right: 6rem;
border-top-right-radius: 0; border-top-right-radius: 0;