---
import ExternalLink from "../links/ExternalLink.astro"
import PajamasIcon from "../icons/PajamasIcon.astro"
import type { MyLink } from "./myLinks"

interface Props extends MyLink {
  class?: string
}

const { title, message, url, icon, class: clazz } = Astro.props
---

<ExternalLink href={url} noStyle>
  <div class:list={["card bg-base-300", clazz]}>
    <div class="card-body p-5 flex flex-row items-center">
      <PajamasIcon name={icon ?? "pajamas:link"} class="w-6 h-6" />
      <div>
        <h5 class="card-title">{title}</h5>
        <p class="prose">{message}</p>
      </div>
    </div>
  </div>
</ExternalLink>