44 lines
1.0 KiB
TypeScript
44 lines
1.0 KiB
TypeScript
import { Download } from "lucide-react";
|
|
import Image, { StaticImageData } from "next/image";
|
|
import { ReactNode } from "react";
|
|
|
|
type ResourceCardProps = {
|
|
title?: string;
|
|
description?: string;
|
|
btnLabel?: string;
|
|
imageAlt?: string;
|
|
image?: StaticImageData;
|
|
btnHref?: string;
|
|
BtnIcon: ReactNode;
|
|
};
|
|
|
|
export default function ResourceCard({
|
|
title,
|
|
BtnIcon,
|
|
description,
|
|
btnLabel: downloadLabel,
|
|
imageAlt,
|
|
image,
|
|
btnHref: downloadHref,
|
|
}: ResourceCardProps) {
|
|
return (
|
|
<div className="hero bg-base-200 rounded-xl shadow-lg p-8">
|
|
<div className="hero-content flex-col lg:flex-row">
|
|
{image && (
|
|
<div className="max-w-sm w-full">
|
|
<Image src={image} alt={imageAlt ?? ""} width={600} className="rounded-lg shadow-2xl" />
|
|
</div>
|
|
)}
|
|
<div className="lg:ml-10 mt-6 lg:mt-0">
|
|
<h1 className="text-3xl font-bold">{title}</h1>
|
|
<p className="py-2 max-w-2xl text-base">{description}</p>
|
|
<a href={downloadHref} className="btn btn-primary mt-4">
|
|
{BtnIcon}
|
|
{downloadLabel}
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|