o2o-triple-pick/components/Hero.tsx

39 lines
1.3 KiB
TypeScript

import Link from "next/link";
import ShareButton from "./ShareButton";
type Share = { url: string; title: string; text: string };
// 브랜드 헤더 (대시보드·상세 공용). 경기별 후킹 카피는 상세 페이지에서 별도 노출.
export default function Hero({
back = false,
share,
}: {
back?: boolean;
share?: Share;
}) {
return (
<header className="pt-5 text-center">
{back && (
<div className="mb-3 flex items-center justify-between">
<Link
href="/"
className="flex items-center gap-1 rounded-full border border-white/12 bg-white/8 px-3 py-1.5 text-[12px] font-bold text-white/85 active:scale-95"
>
</Link>
{share && <ShareButton {...share} />}
</div>
)}
<div className="font-impact text-[44px] leading-none tracking-tight">
TRIPLE PICK <span className="text-[var(--green)]">2026</span>
</div>
<div className="mt-2 text-[16px] font-extrabold text-[var(--green)]">
AI Prediction Arena
</div>
<div className="mt-2 inline-block rounded-full border border-white/12 bg-white/8 px-3 py-1 text-[13px] font-semibold text-white/85">
AI
</div>
</header>
);
}