svrjs-nextjs-website/app/(auth)/_components/Card.tsx

24 lines
655 B
TypeScript
Raw Normal View History

2024-07-30 21:17:07 +02:00
import { ArrowUpRight } from "lucide-react";
import Link from "next/link";
import { FC } from "react";
interface CardProps {
title: string;
url: string;
}
const Card: FC<CardProps> = ({ title, url }) => {
return (
<div className=" bg-zinc-900 border rounded-lg hover:bg-zinc-800 transition-all">
<Link href={url} className="group">
<div className="flex-center rounded-lg p-6">
<h2 className="text-2xl font-bold mb-2">{title}</h2>
<ArrowUpRight className="w-5 h-5 mb-2 ml-2 opacity-0 group-hover:opacity-100 transition-all duration-300" />
</div>
</Link>
</div>
);
};
export default Card;