49 lines
1.2 KiB
TypeScript
49 lines
1.2 KiB
TypeScript
"use client";
|
|
import React from "react";
|
|
import useEmblaCarousel from "embla-carousel-react";
|
|
import Image from "next/image";
|
|
import './carousel.css';
|
|
|
|
export const EmblaCarousel = () => {
|
|
const [emblaRef] = useEmblaCarousel();
|
|
|
|
return (
|
|
<div className="embla" ref={emblaRef}>
|
|
<div className="embla__container">
|
|
<div className="embla__slide">
|
|
<Image
|
|
src="/img01.webp"
|
|
alt="/"
|
|
width={0}
|
|
height={0}
|
|
sizes="100vw"
|
|
style={{ width: "100%", height: "auto" }} // optional
|
|
/>
|
|
</div>
|
|
<div className="embla__slide">
|
|
{" "}
|
|
<Image
|
|
src="/IMG_2431.jpg"
|
|
alt="/"
|
|
width={0}
|
|
height={0}
|
|
sizes="100vw"
|
|
style={{ width: "100%", height: "auto" }} // optional
|
|
/>
|
|
</div>
|
|
<div className="embla__slide">
|
|
{" "}
|
|
<Image
|
|
src="/images/bar01.jpg"
|
|
alt="/"
|
|
width={0}
|
|
height={0}
|
|
sizes="100vw"
|
|
style={{ width: "100%", height: "auto" }} // optional
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|