This repository has no description
Something went wrong. Try again.
1.2 kB · 40 lines
TSX
at main
1234567891011121314151617181920212223242526272829303132333435363738394041import Link from 'next/link'import type { Project } from '@/payload-types'
interface ProjectPreviewProps { project: Project className?: string headingLevel?: 'h2' | 'h3'}
export function ProjectPreview({ project, className, headingLevel: TitleTag = 'h2',}: ProjectPreviewProps) { const { title, slug, description } = project
return ( <Link href={`/projects/${slug}/`} className={[ 'group border-hair text-ink grid grid-cols-[1fr_auto] gap-8 border-b py-7 no-underline transition-[padding] duration-200 ease-out hover:pl-3', className ?? '', ] .join(' ') .trim()} > <div> <TitleTag className="group-hover:decoration-ink-4 m-0 mb-2.5 font-serif text-[28px] leading-tight font-normal tracking-[-0.015em] group-hover:underline group-hover:underline-offset-4"> {title} </TitleTag> {description && ( <p className="text-ink-2 m-0 text-[15px] leading-[1.55]">{description}</p> )} </div> <span className="text-ink-3 self-center font-mono text-base opacity-0 transition-opacity group-hover:opacity-100"> → </span> </Link> )}