ImageViewer.tsx
1interface ImageViewerProps {
2 src: string
3 alt: string
4}
5
6export function ImageViewer({ src, alt }: ImageViewerProps) {
7 return (
8 <figure className="markdown-image-viewer my-8">
9 <div className="overflow-hidden rounded-lg">
10 <img
11 src={src}
12 alt={alt}
13 className="h-auto w-full transition-transform duration-300 hover:scale-105"
14 />
15 </div>
16 {alt && (
17 <figcaption className="mt-2 text-center text-sm italic text-gray-400">
18 {alt}
19 </figcaption>
20 )}
21 </figure>
22 )
23}
24