interface CardProps {
  url: string
  title: string
  description: string
}

export const Card: React.FC<CardProps> = ({
  url,
  title,
  description,
}: CardProps) => (
  <a
    href={url}
    target="_blank"
    rel="noopener noreferrer"
    className="max-w-xs p-6 m-4 text-left transition-colors border border-gray-200 rounded-xl text-inherit hover:border-blue-600 hover:text-blue-600 focus:border-blue-600 focus:text-blue-600 active:border-blue-600 active:text-blue-600"
  >
    <h2 className="mb-4 text-2xl">{title} &rarr;</h2>
    <p className="m-0 text-xl">{description}</p>
  </a>
)