diff --git a/components/TeamFlag.tsx b/components/TeamFlag.tsx index f96f842..90de850 100644 --- a/components/TeamFlag.tsx +++ b/components/TeamFlag.tsx @@ -1,7 +1,14 @@ import type { Team } from "@/lib/types"; -// 모든 경기에 일반화된 국기 렌더. -// KOR = 실제 png 자산, CZE = 인라인 SVG(비율 보존), 그 외 = 이모지(컨테이너 높이에 비례, 안 잘림). +// 모든 국기를 직사각형 SVG로 통일 (flagcdn, 퍼블릭 도메인). +// 이모지(OS별 휘날림/광택 렌더) 제거 → 일관된 사각형. object-cover로 박스를 꽉 채움(왜곡 없음). +const FLAG_FILE: Record = { + KOR: "kr", + CZE: "cz", + MEX: "mx", + RSA: "za", +}; + export default function TeamFlag({ team, className = "", @@ -9,30 +16,17 @@ export default function TeamFlag({ team: Team; className?: string; }) { - if (team.code === "KOR") { + const file = FLAG_FILE[team.code]; + if (file) { return ( {team.name} ); } - if (team.code === "CZE") { - return ( - - - - - - ); - } - // 그 외 국가 — 이모지 국기. 컨테이너 높이(cqh) 기준으로 크기를 잡아 잘림/찌그러짐 방지. + // 미등록 국가 fallback — 이모지(직사각형 박스, 잘림 없음) return ( \ No newline at end of file diff --git a/public/icons/flags/kr.svg b/public/icons/flags/kr.svg new file mode 100644 index 0000000..a44c6e1 --- /dev/null +++ b/public/icons/flags/kr.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/public/icons/flags/mx.svg b/public/icons/flags/mx.svg new file mode 100644 index 0000000..b82436b --- /dev/null +++ b/public/icons/flags/mx.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/public/icons/flags/za.svg b/public/icons/flags/za.svg new file mode 100644 index 0000000..a00b44a --- /dev/null +++ b/public/icons/flags/za.svg @@ -0,0 +1 @@ + \ No newline at end of file