card-deck-demo

1import {
2  CardDeckContainer,
3  CardDeckItem,
4} from "@/components/ui/card-deck"
5 
6export default function CardDeckDemo() {
7  const images = [
8    {
9      src: "https://images.unsplash.com/photo-1517423440428-a5a00ad493e8?w=400&h=600&fit=crop",
10      alt: "Coffee Cup",
11    },
12    {
13      src: "https://images.unsplash.com/photo-1501594907352-04cda38ebc29?w=400&h=600&fit=crop",
14      alt: "Mountain Lake",
15    },
16    {
17      src: "https://images.unsplash.com/photo-1469474968028-56623f02e42e?w=400&h=600&fit=crop",
18      alt: "Nature Path",
19    },
20  ]
21 
22  return (
23    <div className="flex h-full w-full items-center justify-center">
24      <CardDeckContainer>
25        {images.map((image, index) => (
26          <CardDeckItem key={index} className="rounded-3xl">
27            <img
28              className="h-full w-full rounded-3xl object-cover"
29              src={image.src}
30              alt={image.alt}
31            />
32          </CardDeckItem>
33        ))}
34      </CardDeckContainer>
35    </div>
36  )
37}