slick arrows

This commit is contained in:
2024-06-25 16:41:32 +02:00
parent b34d802908
commit 78e802f07d
5 changed files with 72 additions and 29 deletions
@@ -15,9 +15,11 @@ $slick-dot-color: black !default;
$slick-dot-color-active: $slick-dot-color !default;
$slick-prev-character: "\003C" !default;
$slick-next-character: "\003E" !default;
// $slick-prev-character: "../../../../../dist/" !default;
// $slick-next-character: "\003E" !default;
$slick-dot-character: "\2022" !default;
$slick-dot-size: 40px !default;
$slick-opacity-default: 0.75 !default;
$slick-opacity-default: 0.40 !default;
$slick-opacity-on-hover: 1 !default;
$slick-opacity-not-active: 0.25 !default;
@@ -72,7 +74,7 @@ $slick-opacity-not-active: 0.25 !default;
cursor: pointer;
background: transparent;
color: transparent;
top: 20%;
top: 18%;
-webkit-transform: translate(0, -50%);
-ms-transform: translate(0, -50%);
transform: translate(0, -50%);
@@ -102,37 +104,41 @@ $slick-opacity-not-active: 0.25 !default;
}
.slick-prev {
left: -25px;
left: 250px;
padding-left: 4rem;
[dir="rtl"] & {
left: auto;
right: 200px;
}
&:before {
content: $slick-prev-character;
font-weight: lighter;
content: url('../../dist/images/grandes_fleches_prev.svg');
// content: $slick-prev-character;
// font-weight: lighter;
[dir="rtl"] & {
content: $slick-next-character;
font-weight: lighter;
content: url('../../dist/images/grandes_fleches_prev.svg');
// content: $slick-next-character;
// font-weight: lighter;
}
}
}
.slick-next {
right: 200px;
right: 350px;
[dir="rtl"] & {
left: -25px;
right: auto;
}
&:before {
content: $slick-next-character;
font-weight: lighter;
content: url('../../dist/images/grandes_fleches_next.svg');
// content: $slick-next-character;
// font-weight: lighter;
[dir="rtl"] & {
content: $slick-prev-character;
font-weight: lighter;
content: url('../../dist/images/grandes_fleches_next.svg');
// content: $slick-prev-character;
// font-weight: lighter;
}
}
@@ -13,8 +13,7 @@ $slick-arrow-color: $yellow-puca !default;
.view-actus.slick-slider.slick-next {
&:before {
content: $slick-next-character;
font-weight: 100;
background: rgba(255, 255, 255, 0.1);
}
}