---
import Card from "../Card.astro";
import { Icon } from "astro-icon";

export interface Props {
    title: string;
    iconName: string;
    description: string;
}

const { title, description, iconName } = Astro.props;
---

<Card class="w-[300px] shrink-0 grow">
    <div class="text-primary w-12 mb-4">
        <Icon name={iconName} />
    </div>
    <h4 class="text-lg font-bold">
        {title}
    </h4>
    <p class="text-secondary">
        {description}
    </p>
</Card>