42 lines
1.1 KiB
TypeScript
42 lines
1.1 KiB
TypeScript
import type { Team } from "@/lib/types";
|
|
|
|
// 모든 국기를 직사각형 SVG로 통일 (flagcdn, 퍼블릭 도메인).
|
|
// 이모지(OS별 휘날림/광택 렌더) 제거 → 일관된 사각형. object-cover로 박스를 꽉 채움(왜곡 없음).
|
|
const FLAG_FILE: Record<string, string> = {
|
|
KOR: "kr",
|
|
CZE: "cz",
|
|
MEX: "mx",
|
|
RSA: "za",
|
|
};
|
|
|
|
export default function TeamFlag({
|
|
team,
|
|
className = "",
|
|
}: {
|
|
team: Team;
|
|
className?: string;
|
|
}) {
|
|
const file = FLAG_FILE[team.code];
|
|
if (file) {
|
|
return (
|
|
<img
|
|
src={`/icons/flags/${file}.svg`}
|
|
alt={team.name}
|
|
className={`border border-[var(--line-d)] object-cover ${className}`}
|
|
/>
|
|
);
|
|
}
|
|
// 미등록 국가 fallback — 이모지(직사각형 박스, 잘림 없음)
|
|
return (
|
|
<span
|
|
className={`grid place-items-center overflow-hidden border border-[var(--line-d)] bg-white/[0.06] ${className}`}
|
|
style={{ containerType: "size" }}
|
|
aria-label={team.name}
|
|
>
|
|
<span className="leading-none" style={{ fontSize: "92cqh" }}>
|
|
{team.flag}
|
|
</span>
|
|
</span>
|
|
);
|
|
}
|