64 lines
1.4 KiB
JavaScript
64 lines
1.4 KiB
JavaScript
"use client";
|
|
|
|
import { Autoplay, Navigation, Pagination } from "swiper/modules";
|
|
import { Swiper, SwiperSlide } from "swiper/react";
|
|
|
|
const swiperOptions = {
|
|
modules: [Autoplay, Pagination, Navigation],
|
|
slidesPerView: 1,
|
|
spaceBetween: 30,
|
|
loop: true,
|
|
autoplay: {
|
|
delay: 1500,
|
|
disableOnInteraction: false,
|
|
},
|
|
breakpoints: {
|
|
992: {
|
|
slidesPerView: 4,
|
|
},
|
|
768: {
|
|
slidesPerView: 3,
|
|
},
|
|
576: {
|
|
slidesPerView: 3,
|
|
},
|
|
0: {
|
|
slidesPerView: 2,
|
|
},
|
|
},
|
|
};
|
|
|
|
export default function BrandActiveSlider() {
|
|
return (
|
|
<>
|
|
<Swiper {...swiperOptions}>
|
|
<SwiperSlide>
|
|
<div className="brand-item">
|
|
<img src="/assets/img/custom/COX-MEDIA.png" alt="" />
|
|
</div>
|
|
</SwiperSlide>
|
|
<SwiperSlide>
|
|
<div className="brand-item">
|
|
<img src="/assets/img/custom/logo_cl.png" alt="" />
|
|
</div>
|
|
</SwiperSlide>
|
|
<SwiperSlide>
|
|
<div className="brand-item">
|
|
<img src="/assets/img/custom/brand-3.png" alt="" />
|
|
</div>
|
|
</SwiperSlide>
|
|
<SwiperSlide>
|
|
<div className="brand-item">
|
|
<img src="/assets/img/custom/brand-5.png" alt="" />
|
|
</div>
|
|
</SwiperSlide>
|
|
<SwiperSlide>
|
|
<div className="brand-item">
|
|
<img src="/assets/img/custom/brand-7.png" alt="" />
|
|
</div>
|
|
</SwiperSlide>
|
|
</Swiper>
|
|
</>
|
|
);
|
|
}
|