Files
portfolio/components/content/ProjectCard.tsx
T

24 lines
959 B
TypeScript

import { IconArrowNarrowRight } from '@tabler/icons-react';
interface ProjectCardProps {
title: string;
year: string;
stack: string[];
description: string;
outcome: string;
}
export default function ProjectCard({ title, year, stack, description, outcome }: ProjectCardProps) {
return (
<section className="space-y-2 border-t border-neutral-700 pt-4 flex flex-col mt-5">
<button className='flex justify-between hover:text-neutral-500 transition-colors items-center w-full text-left cursor-pointer group'>
<h1 className="text-[24px] font-semibold">{title}</h1>
<IconArrowNarrowRight className='group-hover:scale-150 transition-transform'/>
</button>
<p className="text-md text-neutral-400 text-muted">{year} {stack.join(' · ')}</p>
<p className="text-xl">{description}</p>
<p className="text-md text-neutral-400 text-muted">{outcome}</p>
</section>
);
}