36 lines
1.0 KiB
TypeScript
36 lines
1.0 KiB
TypeScript
import { ChevronRight } from "lucide-react";
|
|
import { Link } from "react-router-dom";
|
|
|
|
export function SectionHeader({
|
|
title,
|
|
viewAllTo,
|
|
viewAllLabel,
|
|
}: {
|
|
title: string;
|
|
viewAllTo?: string;
|
|
viewAllLabel?: string;
|
|
}) {
|
|
return (
|
|
<div className="flex h-[49px] items-center justify-between gap-4 md:h-6">
|
|
<div className="flex min-w-0 items-center gap-3 md:gap-4">
|
|
<span
|
|
className="h-5 w-[3px] shrink-0 bg-ark-gold md:h-6 md:w-1"
|
|
aria-hidden
|
|
/>
|
|
<h2 className="truncate text-lg font-semibold leading-[24.5px] tracking-tight text-white md:text-2xl md:font-bold md:leading-6">
|
|
{title}
|
|
</h2>
|
|
</div>
|
|
{viewAllTo && viewAllLabel ? (
|
|
<Link
|
|
to={viewAllTo}
|
|
className="inline-flex shrink-0 items-center gap-1 text-[13px] font-normal leading-none text-ark-gold hover:text-ark-gold2 md:text-[15px] md:font-medium"
|
|
>
|
|
{viewAllLabel}
|
|
<ChevronRight className="h-4 w-4" strokeWidth={2.7} />
|
|
</Link>
|
|
) : null}
|
|
</div>
|
|
);
|
|
}
|