chpark/vexplor
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

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

Browse Source 
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
Download Patch File Download Diff File Expand all files Collapse all files

26
frontend/components/dataflow/node-editor/nodes/DataTransformNode.tsx
View File

@@ -13,11 +13,11 @@ export const DataTransformNode = memo(({ data, selected }: NodeProps<DataTransfo
return (
<div
className={`min-w-[250px] rounded-lg border-2 bg-white shadow-md transition-all ${
selected ? "border-orange-500 shadow-lg" : "border-gray-200"
selected ? "border-orange-500 shadow-lg" : "border-border"
}`}
>
{/* 헤더 */}
<div className="flex items-center gap-2 rounded-t-lg bg-indigo-600 px-3 py-2 text-white">
<div className="flex items-center gap-2 rounded-t-lg bg-primary px-3 py-2 text-white">
<Wand2 className="h-4 w-4" />
<div className="flex-1">
<div className="text-sm font-semibold">{data.displayName || "데이터 변환"}</div>
@@ -40,29 +40,29 @@ export const DataTransformNode = memo(({ data, selected }: NodeProps<DataTransfo
<div className="mb-1 flex items-center gap-2 text-xs">
<span className="font-medium text-indigo-700">{transform.type}</span>
</div>
<div className="text-xs text-gray-600">
<div className="text-xs text-muted-foreground">
{sourceLabel}
<span className="mx-1 text-gray-400">→</span>
<span className="mx-1 text-muted-foreground/70">→</span>
{isInPlace ? (
<span className="font-medium text-indigo-600">(자기자신)</span>
<span className="font-medium text-primary">(자기자신)</span>
) : (
<span>{targetLabel}</span>
)}
</div>
{/* 타입별 추가 정보 */}
{transform.type === "EXPLODE" && transform.delimiter && (
<div className="mt-1 text-xs text-gray-500">구분자: {transform.delimiter}</div>
<div className="mt-1 text-xs text-muted-foreground">구분자: {transform.delimiter}</div>
)}
{transform.type === "CONCAT" && transform.separator && (
<div className="mt-1 text-xs text-gray-500">구분자: {transform.separator}</div>
<div className="mt-1 text-xs text-muted-foreground">구분자: {transform.separator}</div>
)}
{transform.type === "REPLACE" && (
<div className="mt-1 text-xs text-gray-500">
<div className="mt-1 text-xs text-muted-foreground">
"{transform.searchValue}" → "{transform.replaceValue}"
</div>
)}
{transform.expression && (
<div className="mt-1 text-xs text-gray-500">
<div className="mt-1 text-xs text-muted-foreground">
<code className="rounded bg-white px-1 py-0.5">{transform.expression}</code>
</div>
)}
@@ -70,17 +70,17 @@ export const DataTransformNode = memo(({ data, selected }: NodeProps<DataTransfo
);
})}
{data.transformations.length > 3 && (
<div className="text-xs text-gray-400">... 외 {data.transformations.length - 3}개</div>
<div className="text-xs text-muted-foreground/70">... 외 {data.transformations.length - 3}개</div>
)}
</div>
) : (
<div className="py-4 text-center text-xs text-gray-400">변환 규칙 없음</div>
<div className="py-4 text-center text-xs text-muted-foreground/70">변환 규칙 없음</div>
)}
</div>
{/* 핸들 */}
<Handle type="target" position={Position.Left} className="!h-3 !w-3 !bg-indigo-500" />
<Handle type="source" position={Position.Right} className="!h-3 !w-3 !bg-indigo-500" />
<Handle type="target" position={Position.Left} className="!h-3 !w-3 !bg-primary" />
<Handle type="source" position={Position.Right} className="!h-3 !w-3 !bg-primary" />
</div>
);
});