---
import DirectusImg from "./DirectusImg.astro"

export interface Props {
  name: string
  image: string
  link?: string
  small?: boolean
}
const { name, image, link, small } = Astro.props
---

<div class="card md:card-side bg-base-300 text-left">
  <figure class="md:flex-none">
    <DirectusImg
      src={image}
      widths={[500]}
      alt=""
      format="webp"
      class="h-12 md:h-full w-full object-cover"
      class:list={{
        "md:w-48": !small,
        "md:w-32": small,
      }}
    />
  </figure>
  <div class="card-body">
    {
      link ? (
        <a class="card-title link link-primary" href={link}>
          {name}
        </a>
      ) : (
        <span class="card-title">{name}</span>
      )
    }
    <p class="text-lg">
      <slot />
    </p>
  </div>
</div>