27 lines
839 B
TypeScript
27 lines
839 B
TypeScript
import React from "react";
|
|
import { Swiper, SwiperSlide } from "swiper/react";
|
|
import { Autoplay, Pagination, Navigation } from "swiper/modules";
|
|
import "swiper/css";
|
|
|
|
const Hero = () => {
|
|
return (
|
|
<div className="h-140 rounded-md overflow-hidden">
|
|
<Swiper
|
|
spaceBetween={0}
|
|
slidesPerView={1}
|
|
onSlideChange={() => console.log("slide change")}
|
|
onSwiper={(swiper) => console.log(swiper)}
|
|
className="h-full"
|
|
autoplay={{ delay: 5000, disableOnInteraction: false }}
|
|
modules={[Autoplay, Pagination, Navigation]}
|
|
>
|
|
<SwiperSlide className="bg-red-500">Slide 1</SwiperSlide>
|
|
<SwiperSlide className="bg-blue-500">Slide 2</SwiperSlide>
|
|
<SwiperSlide className="bg-green-500">Slide 3</SwiperSlide>
|
|
</Swiper>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default Hero;
|