o2o-triple-pick/frontend/src/components/Ado2Ad.tsx

38 lines
1.5 KiB
TypeScript

import { type Lang, dict } from "@/lib/i18n";
// 운영사(ADO2) 광고 — 메인 랜딩 하단. 솔리드 퍼플(#A65EFF) 라운드 풀(pill) + 화이트 로고.
export default function Ado2Ad({ lang = "ko" }: { lang?: Lang }) {
const t = dict(lang);
return (
<section className="mt-8">
<div className="mb-2 text-center text-[10px] font-bold uppercase tracking-[0.2em] text-white/35">
{t.adLabel}
</div>
<a
href="https://ado2.o2osolution.ai/"
target="_blank"
rel="noopener noreferrer"
className="flex items-center justify-between gap-3 rounded-full bg-[#A65EFF] px-6 py-3 transition active:scale-[0.99]"
style={{ boxShadow: "0 10px 28px rgba(166,94,255,0.40)" }}
>
{/* 태그라인이 가로 폭을 정하고, 로고는 그 폭에 맞춰 스케일(언어 무관 자동 일치) */}
<span className="flex flex-col items-stretch gap-1">
<img
src="/icons/ado2-white.png"
alt="ADO2"
className="h-auto"
style={{ width: 0, minWidth: "100%" }}
/>
<span className="whitespace-nowrap text-[13px] font-bold leading-none text-white">
{t.ado2Tagline}
</span>
</span>
<span className="flex shrink-0 items-center gap-1 whitespace-nowrap text-[13px] font-extrabold text-white">
{t.ado2Cta}
<span aria-hidden></span>
</span>
</a>
</section>
);
}