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

@@ -102,26 +102,26 @@ export function TableHistoryModal({
const getOperationIcon = (type: string) => {
switch (type) {
case "INSERT":
return <Plus className="h-4 w-4 text-green-600" />;
return <Plus className="h-4 w-4 text-emerald-600" />;
case "UPDATE":
return <FileEdit className="h-4 w-4 text-blue-600" />;
return <FileEdit className="h-4 w-4 text-primary" />;
case "DELETE":
return <Trash2 className="h-4 w-4 text-red-600" />;
return <Trash2 className="h-4 w-4 text-destructive" />;
default:
return <Clock className="h-4 w-4 text-gray-600" />;
return <Clock className="h-4 w-4 text-muted-foreground" />;
}
};
const getOperationBadge = (type: string) => {
switch (type) {
case "INSERT":
return <span className="text-sm font-medium text-green-600"></span>;
return <span className="text-sm font-medium text-emerald-600"></span>;
case "UPDATE":
return <span className="text-sm font-medium text-blue-600"></span>;
return <span className="text-sm font-medium text-primary"></span>;
case "DELETE":
return <span className="text-sm font-medium text-red-600"></span>;
return <span className="text-sm font-medium text-destructive"></span>;
default:
return <span className="text-sm font-medium text-gray-600">{type}</span>;
return <span className="text-sm font-medium text-muted-foreground">{type}</span>;
}
};
@@ -301,8 +301,8 @@ export function TableHistoryModal({
) : (
<div className="space-y-6">
{timeline.map((event, index) => (
<div key={index} className="relative border-l-2 border-gray-200 pb-6 pl-8 last:border-l-0">
<div className="absolute top-0 -left-3 rounded-full border-2 border-gray-200 bg-white p-1">
<div key={index} className="relative border-l-2 border-border pb-6 pl-8 last:border-l-0">
<div className="absolute top-0 -left-3 rounded-full border-2 border-border bg-white p-1">
{getOperationIcon(event.operation_type)}
</div>
@@ -325,12 +325,12 @@ export function TableHistoryModal({
<p className="text-muted-foreground text-xs font-medium"> :</p>
<div className="space-y-1">
{event.changes.map((change, idx) => (
<div key={idx} className="rounded bg-gray-50 p-2 text-xs">
<div key={idx} className="rounded bg-muted p-2 text-xs">
<span className="font-mono font-medium">{change.column}</span>
<div className="mt-1 flex items-center gap-2">
<span className="text-red-600 line-through">{change.oldValue || "(없음)"}</span>
<span className="text-destructive line-through">{change.oldValue || "(없음)"}</span>
<span></span>
<span className="font-medium text-green-600">{change.newValue || "(없음)"}</span>
<span className="font-medium text-emerald-600">{change.newValue || "(없음)"}</span>
</div>
</div>
))}
@@ -355,7 +355,7 @@ export function TableHistoryModal({
</div>
) : (
<table className="w-full text-xs">
<thead className="sticky top-0 border-b bg-gray-50">
<thead className="sticky top-0 border-b bg-muted">
<tr>
{!recordId && <th className="p-2 text-left font-medium"></th>}
<th className="p-2 text-left font-medium"></th>
@@ -370,11 +370,11 @@ export function TableHistoryModal({
{detailRecords.map((record) => {
const displayValue = getDisplayValue(record);
return (
<tr key={record.log_id} className="border-b hover:bg-gray-50">
<tr key={record.log_id} className="border-b hover:bg-muted">
{!recordId && (
<td className="p-2">
{displayValue ? (
<span className="font-medium text-gray-900">{displayValue}</span>
<span className="font-medium text-foreground">{displayValue}</span>
) : (
<span className="text-muted-foreground text-xs">-</span>
)}
@@ -382,8 +382,8 @@ export function TableHistoryModal({
)}
<td className="p-2">{getOperationBadge(record.operation_type)}</td>
<td className="p-2 font-mono">{record.changed_column}</td>
<td className="max-w-[200px] truncate p-2 text-red-600">{record.old_value || "-"}</td>
<td className="max-w-[200px] truncate p-2 text-green-600">{record.new_value || "-"}</td>
<td className="max-w-[200px] truncate p-2 text-destructive">{record.old_value || "-"}</td>
<td className="max-w-[200px] truncate p-2 text-emerald-600">{record.new_value || "-"}</td>
<td className="p-2">{record.changed_by}</td>
<td className="text-muted-foreground p-2">{formatDate(record.changed_at)}</td>
</tr>