carhop__carhop-theme__DEV/resources/css/libs/swiper.css
Antoine M 7b7713c121
All checks were successful
continuous-integration/drone/push Build is passing
FEATURE optmizing css behaviour and responsiveness
2025-09-16 14:07:31 +02:00

48 lines
1.3 KiB
CSS

:root {
--swiper-pagination-bullet-border-radius: 0;
--swiper-pagination-bullet-height: 2px;
--swiper-pagination-bullet-width: 100%;
--swiper-pagination-bullet-horizontal-gap: 0px;
--swiper-theme-color: var(--wp--preset--color--primary) !important;
--swiper-pagination-color: transparent !important;
--swiper-pagination-bullet-inactive-color: transparent !important;
}
.swiper-pagination {
@apply h-fit flex gap-4 lg:gap-8 2xl:gap-12 !static;
top: unset !important;
bottom: 0px !important;
z-index: 100 !important;
}
.swiper-pagination-bullet {
@apply bg-transparent w-full !py-6 relative;
&:after {
@apply content-[''] bg-primary w-full absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2;
height: 2px;
}
}
.swiper-pagination-fraction {
@apply !text-primary font-semibold;
}
.swiper-controls {
@apply flex justify-start gap-6 pt-6 pb-10 static overflow-visible;
.swiper-button-next,
.swiper-button-prev {
@apply static block border border-primary p-12 rounded-full transition-all duration-300;
&:after {
@apply left-1/2 top-1/2 block w-fit;
transform: translate(-50%, -50%);
}
&:hover {
@apply scale-105;
}
}
}
.swiper-wrapper {
@apply mb-4 block lg:flex;
}