Files
wordpress-preseed/wp-content/themes/Pirate-Rogue/css/sass/plugins/_slick-gallery.scss
2019-08-31 00:48:20 +02:00

175 lines
3.9 KiB
SCSS

@charset 'UTF-8';
/* Slider in Gallerys */
.gallery {
.slick-loading .slick-list {
background: #fff url('./img/ajax-loader.gif') center center no-repeat;
}
/* Arrows */
.slick-prev,
.slick-next {
line-height: 0;
position: absolute;
top: 50%;
color: transparent;
display: block;
width: 50px;
padding: 0;
-webkit-transform: translate(0, -50%);
-ms-transform: translate(0, -50%);
transform: translate(0, -50%);
cursor: pointer;
border: none;
outline: none;
background: transparent;
z-index: 20;
}
.slick-prev:hover,
.slick-prev:focus,
.slick-next:hover,
.slick-next:focus {
color: transparent;
outline: none;
background: transparent;
}
.slick-prev:hover:before,
.slick-prev:focus:before,
.slick-next:hover:before,
.slick-next:focus:before {
opacity: 1;
}
.slick-prev.slick-disabled:before,
.slick-next.slick-disabled:before {
opacity: .25;
}
.slick-prev:before,
.slick-next:before {
@extend .fa;
@extend .fa-3x;
line-height: 1;
opacity: .75;
color: $color-main;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.slick-prev {
left: 30px;
}
[dir='rtl'] .slick-prev {
right: 30px;
left: auto;
}
.slick-prev:before {
@extend .fa-chevron-left;
}
[dir='rtl'] .slick-prev:before {
@extend .fa-chevron-right;
}
.slick-next {
right: 30px;
}
[dir='rtl'] .slick-next {
right: auto;
left: 30px;
}
.slick-next:before {
@extend .fa;
@extend .fa-chevron-right;
}
[dir='rtl'] .slick-next:before {
@extend .fa;
@extend .fa-chevron-left;
}
/* Dots */
.slick-dotted.slick-slider {
margin-bottom: 40px;
}
.slick-dots {
position: absolute;
display: block;
width: 100%;
padding: 0;
margin: 0;
list-style: none;
text-align: center;
li {
position: relative;
display: inline-block;
width: 20px;
height: 20px;
margin: 0 5px;
padding: 0;
cursor: pointer;
button {
display: block;
width: 20px;
height: 20px;
padding: 5px;
cursor: pointer;
border: 0;
background: transparent;
color: transparent;
&:hover,
&:focus {
outline: none;
}
&:hover:before,
&:focus:before {
opacity: 0.75;
color: $color-main;
}
&:before {
position: absolute;
top: 0;
left: 0;
@extend .fa;
@extend .fa-circle;
opacity: 0.25;
text-align: center;
color: black;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
}
&:after {
display: none;
}
}
li.slick-active button:before {
opacity: 1;
color: $color-main;
}
}
.slider {
img {
margin: 0 auto;
}
li {
&::before {
content: inherit;
display: none;
margin: 0;
}
}
.gallery-image-caption {
text-align: center;
@include px2rem($font-size-gallery-caption);
}
}
}