twotalesanimation
23 lines
846 B
TypeScript
23 lines
846 B
TypeScript
import Link from "next/link";
|
|
import Frame from "./Frame";
|
|
import type { Project } from "@/content/site";
|
|
|
|
export default function ProjectCard({ project }: { project: Project }) {
|
|
return (
|
|
<Link href={`/work/${project.slug}/`} className="group block">
|
|
<Frame project={project} />
|
|
<div className="mt-5 flex items-start justify-between gap-6">
|
|
<div>
|
|
<h3 className="font-display text-2xl font-light tracking-wide uppercase transition-colors group-hover:text-accent md:text-3xl">
|
|
{project.title}
|
|
</h3>
|
|
<p className="mt-1 text-sm text-muted">{project.client}</p>
|
|
</div>
|
|
<p className="shrink-0 pt-2 text-right font-mono text-[11px] tracking-widest text-muted uppercase">
|
|
{project.credits.slice(0, 2).join(" / ")}
|
|
</p>
|
|
</div>
|
|
</Link>
|
|
);
|
|
}
|