midgard/MapComplete
1
0
Fork 0
forked from MapComplete/MapComplete
Code Pull requests Activity

Move slick buttons to a clickable location

Browse source
This commit is contained in:
Pieter Vander Vennet 2021-02-15 19:06:06 +01:00
parent f86ce4bc17
commit 79fc3f54e5
3 changed files with 16 additions and 81 deletions
Download patch file Download diff file Expand all files Collapse all files

85
css/slideshow.css
View file

@ -1,81 +1,22 @@
.image-slideshow {
position: relative;
display: block;
text-align: center;
max-width: 100%;
margin-top: 1em;
margin-bottom: 1em;
.slick-next {
top: unset;
bottom: -25px;
right: 15px;
z-index: 10000;
}
.slides {
display: block;
overflow: hidden;
}
.prev-button {
display: block;
background-color: black;
opacity: 0.3;
width: 4.0em;
height: 100%;
padding-left: 0.5em;
padding-right: 0.5em;
position: absolute;
top: 50%;
.slick-prev {
top: unset;
bottom: -25px;
left: 0;
transform: translate(0, -50%);
z-index: 5060;
border-radius: 1em;
z-index: 10000;
}
.next-button {
display: block;
background-color: black;
opacity: 0.3;
width: 4.0em;
height: 100%;
padding-left: 0.5em;
padding-right: 0.5em;
position: absolute;
top: 50%;
right: 0;
transform: translate(0, -50%);
border-radius: 1em;
z-index: 5060;
.slick-next::before {
font-size: 35px;
}
.vspan {
height: calc(50% - 3em);
}
.prev-button img {
margin-left: -1em;
width: 6em;
text-align: center;
}
.next-button img {
margin-left: -1em;
width: 6em;
text-align: center;
}
.slide > span {
max-height: 40vh;
}
.slide > span img {
height: auto;
width: auto;
max-width: 100%;
max-height: 30vh;
border-radius: 1em;
.slick-prev::before {
font-size: 35px;
}