refactor: 전체 프론트엔드 하드코딩 색상 → CSS 변수 일괄 치환

447+ 파일, 4500+ 줄 변경:
- gray-* → border/bg-muted/text-foreground/text-muted-foreground
- blue-* → primary/ring
- red-* → destructive
- green-* → emerald (일관성)
- indigo-* → primary
- yellow/orange → amber (통일)
- dark mode 변형도 시맨틱 토큰으로 변환

Made-with: Cursor
This commit is contained in:
DDD1542
2026-03-09 14:31:59 +09:00
parent d967cf0a0d
commit 4f10b5e42d
447 changed files with 4520 additions and 4520 deletions

View File

@@ -282,7 +282,7 @@ const KeySelectCombobox: React.FC<KeySelectComboboxProps> = ({
onChange(null);
setOpen(false);
}}
className="text-red-600"
className="text-destructive"
>
<X className="mr-2 h-4 w-4" />
@@ -895,12 +895,12 @@ export const MultilangSettingsModal: React.FC<MultilangSettingsModalProps> = ({
const TranslationStatusIcon: React.FC<{ status: TranslationStatus }> = ({ status }) => {
switch (status) {
case "complete":
return <CheckCircle2 className="h-4 w-4 text-green-500" />;
return <CheckCircle2 className="h-4 w-4 text-emerald-500" />;
case "partial":
return <CircleDot className="h-4 w-4 text-yellow-500" />;
return <CircleDot className="h-4 w-4 text-amber-500" />;
case "none":
default:
return <Circle className="h-4 w-4 text-gray-300" />;
return <Circle className="h-4 w-4 text-muted-foreground/50" />;
}
};
@@ -1270,10 +1270,10 @@ export const MultilangSettingsModal: React.FC<MultilangSettingsModalProps> = ({
isSelected
? "border-primary bg-primary/10 ring-1 ring-primary"
: translationStatus === "complete"
? "border-green-200 bg-green-50 hover:bg-green-100"
? "border-emerald-200 bg-emerald-50 hover:bg-emerald-100"
: translationStatus === "partial"
? "border-yellow-200 bg-yellow-50 hover:bg-yellow-100"
: "border-gray-200 bg-white hover:bg-gray-50"
? "border-amber-200 bg-amber-50 hover:bg-amber-100"
: "border-border bg-white hover:bg-muted"
)}
>
{/* 번역 상태 아이콘 */}
@@ -1301,7 +1301,7 @@ export const MultilangSettingsModal: React.FC<MultilangSettingsModalProps> = ({
</div>
{/* 오른쪽: 선택된 항목 상세 및 번역 편집 */}
<div className="flex w-1/2 flex-col rounded-md border bg-gray-50 p-4">
<div className="flex w-1/2 flex-col rounded-md border bg-muted p-4">
{selectedLabelItem ? (
<>
{/* 선택된 항목 정보 */}
@@ -1388,15 +1388,15 @@ export const MultilangSettingsModal: React.FC<MultilangSettingsModalProps> = ({
<span className="font-medium"> </span>
<div className="flex items-center gap-3 text-xs text-muted-foreground">
<span className="flex items-center gap-1">
<CheckCircle2 className="h-3 w-3 text-green-500" />
<CheckCircle2 className="h-3 w-3 text-emerald-500" />
{translationStats.complete}
</span>
<span className="flex items-center gap-1">
<CircleDot className="h-3 w-3 text-yellow-500" />
<CircleDot className="h-3 w-3 text-amber-500" />
{translationStats.partial}
</span>
<span className="flex items-center gap-1">
<Circle className="h-3 w-3 text-gray-300" />
<Circle className="h-3 w-3 text-muted-foreground/50" />
{translationStats.none}
</span>
</div>