react-components/blog/cover-image.tsx
2024-10-30 18:28:41 +01:00

36 lines
697 B
TypeScript

import Link from "next/link";
import Image from "next/image";
import {cn} from "@/lib/utils";
type Props = {
title: string;
src: string;
slug?: string;
};
const CoverImage = ({ title, src, slug }: Props) => {
const image = (
<Image
src={src}
alt={`Cover Image for ${title}`}
className={cn("shadow-sm w-full", {
"hover:shadow-lg transition-shadow duration-200": slug,
})}
width={1300}
height={630}
/>
);
return (
<div className="sm:mx-0">
{slug ? (
<Link href={`/blog/${slug}`} aria-label={title}>
{image}
</Link>
) : (
image
)}
</div>
);
};
export default CoverImage;