import Image from "next/image";

export default function TitleCard({ card_title }) {
  return (
    <div className="rounded-lg ring-4 ring-werefox-blue-dark dark:ring-werefox-blue bg-werefox-grey-light dark:bg-werefox-grey">
      <p className="p-4 w-full inline-block text-xl text-center text-werefox-blue-dark dark:text-werefox-blue">
        <span className="animate-bounce inline-block w-6 h-6 align-middle">
          <Image
            src="/emoji/pixel_alexis.png"
            layout="fill"
            objectFit="contain"
            alt="Pixel Alexis!"
          />
        </span>
        {"- "}
        {card_title}
      </p>
    </div>
  );
}