From fbbe8b34272a2de233067ccb2c4a08fb7cba50d1 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=EB=AF=BC=ED=97=8C?= <min815371@gmail.com>
Date: Tue, 16 Jun 2026 11:42:21 +0900
Subject: [PATCH] =?UTF-8?q?[refactor]=20front:=20=EB=AF=B8=EC=82=AC?=
 =?UTF-8?q?=EC=9A=A9=20sidebar=20=ED=86=A0=ED=81=B0=20=EC=A0=9C=EA=B1=B0?=
 =?UTF-8?q?=20=EB=B0=8F=20design.md=20=EC=82=AD=EC=A0=9C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 프로젝트에 사이드바 없음 → --sidebar-* 토큰 및 @theme 매핑 제거
- 토큰 출처 문서(design.md) 삭제

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
---
 front/design.md     | 112 --------------------------------------------
 front/src/index.css |  22 +--------
 2 files changed, 1 insertion(+), 133 deletions(-)
 delete mode 100644 front/design.md

diff --git a/front/design.md b/front/design.md
deleted file mode 100644
index 095a73f..0000000
--- a/front/design.md
+++ /dev/null
@@ -1,112 +0,0 @@
----
- 
-## 색상 (Color)
- 
-값은 `tokens.css`의 `:root`(light) / `.dark`(dark) 정의. 모두 hex (일부 8자리 hex = 알파 포함), `--background-rgb`만 raw rgb.
- 
-| 토큰 | Tailwind 유틸 | Light | Dark | 용도 |
-|---|---|---|---|---|
-| `--background` | `bg-background` | `#ffffff` (흰색) | `#0a0a0a` (거의 검정) | 페이지 배경 |
-| `--background-rgb` | — | `250, 250, 250` | `9, 9, 11` | rgba() 조합용 raw 값 |
-| `--foreground` | `text-foreground` | `#0a0a0a` | `#fafafa` | 기본 텍스트 |
-| `--card` | `bg-card` | `#ffffff` | `#171717` | 카드 배경 |
-| `--card-foreground` | `text-card-foreground` | `#0a0a0a` | `#fafafa` | 카드 텍스트 |
-| `--popover` | `bg-popover` | `#ffffff` | `#171717` | 팝오버 배경 |
-| `--popover-foreground` | `text-popover-foreground` | `#0a0a0a` | `#fafafa` | 팝오버 텍스트 |
-| `--primary` | `bg-primary` | `#171717` (다크 그레이) | `#e5e5e5` (라이트 그레이) | 주요 액션/버튼 |
-| `--primary-foreground` | `text-primary-foreground` | `#fafafa` | `#171717` | primary 위 텍스트 |
-| `--secondary` | `bg-secondary` | `#f5f5f5` | `#262626` | 보조 배경 |
-| `--secondary-foreground` | `text-secondary-foreground` | `#171717` | `#fafafa` | 보조 텍스트 |
-| `--muted` | `bg-muted` | `#f5f5f5` | `#262626` | 흐린 배경 |
-| `--muted-foreground` | `text-muted-foreground` | `#737373` | `#a1a1a1` | 흐린 텍스트/캡션 |
-| `--accent` | `bg-accent` | `#f5f5f5` | `#262626` | 강조 배경(hover 등) |
-| `--accent-foreground` | `text-accent-foreground` | `#171717` | `#fafafa` | accent 위 텍스트 |
-| `--border` | `border-border` | `#e5e5e5` | `#ffffff1a` (흰색 10%) | 테두리/구분선 |
-| `--input` | `border-input` | `#e5e5e5` | `#ffffff26` (흰색 15%) | 인풋 테두리 |
-| `--ring` | `ring-ring` | `#a1a1a1` | `#737373` | 포커스 링 |
-| `--destructive` | `bg-destructive` | `#e7000b` (빨강) | `#ff6467` | 위험/삭제 |
-| `--success` | `bg-success` | `#10b981` (초록) | `#10b981` | 성공 (light/dark 동일) |
-| `--warning` | `bg-warning` | `#f59e0b` (주황) | `#f59e0b` | 경고 (light/dark 동일) |
- 
-### 차트 (Chart) — 무채색 스케일
- 
-| 토큰 | Light | Dark |
-|---|---|---|
-| `--chart-1` | `#d4d4d4` | `#d4d4d4` |
-| `--chart-2` | `#737373` | `#737373` |
-| `--chart-3` | `#525252` | `#525252` |
-| `--chart-4` | `#404040` | `#404040` |
-| `--chart-5` | `#262626` | `#262626` |
- 
-### 사이드바 (Sidebar)
- 
-| 토큰 | Light | Dark |
-|---|---|---|
-| `--sidebar` | `#fafafa` | `#171717` |
-| `--sidebar-foreground` | `#0a0a0a` | `#fafafa` |
-| `--sidebar-primary` | `#171717` | `#1447e6` (보라) |
-| `--sidebar-primary-foreground` | `#fafafa` | `#fafafa` |
-| `--sidebar-accent` | `#f5f5f5` | `#262626` |
-| `--sidebar-accent-foreground` | `#171717` | `#fafafa` |
-| `--sidebar-border` | `#e5e5e5` | `#ffffff1a` |
-| `--sidebar-ring` | `#a1a1a1` | `#737373` |
- 
----
- 
-## 타이포그래피 (Typography)
- 
-`<Typography variant="...">` 로 사용. 출처: [src/components/ui/typography.tsx](src/components/ui/typography.tsx). `defaultVariant`는 `body`.
- 
-| variant | 기본 태그 | 클래스 | 용도 |
-|---|---|---|---|
-| `h1` | `<h1>` | `text-4xl font-bold tracking-tight text-foreground` | 페이지 제목 |
-| `h2` | `<h2>` | `text-2xl font-bold tracking-tight text-foreground` | 섹션 제목 |
-| `h3` | `<h3>` | `text-xl font-bold text-foreground` | 서브 제목 |
-| `h4` | `<h4>` | `text-lg font-semibold text-foreground` | 소제목 |
-| `body` | `<p>` | `text-base text-foreground` | 본문 (기본값) |
-| `small` | `<p>` | `text-sm text-foreground` | 작은 본문 |
-| `muted` | `<p>` | `text-sm text-muted-foreground leading-relaxed` | 보조 설명 |
-| `label` | `<span>` | `text-xs font-semibold uppercase tracking-wider text-foreground` | 폼 라벨 |
-| `mono` | `<span>` | `text-xs font-mono uppercase tracking-wider text-muted-foreground` | 콘솔/메타 캡션 |
-| `caption` | `<span>` | `text-[11px] text-muted-foreground leading-normal` | 사이드바/헤더 chrome 메타 |
- 
-`as` prop으로 의미 태그 교체 가능(예: `label` variant를 `<label htmlFor>`로). 색은 variant에 토큰 클래스로 고정됨.
- 
-모든 텍스트 색은 `text-foreground`(또는 muted 계열)로 토큰화됨.
- 
----
- 
-## 폰트 (Font Family)
- 
-| 토큰 | 스택 | 비고 |
-|---|---|---|
-| `--font-sans` | `'Pretendard Variable', 'Geist Variable', system-ui, sans-serif` | 본문 기본 (`@theme inline`이 최종 적용) |
-| `--font-mono` | `'JetBrains Mono', ui-monospace, SFMono-Regular, monospace` | 모노 |
-| `--font-heading` | `var(--font-sans)` | 헤딩 = sans |
- 
-Pretendard는 `public/fonts/PretendardVariable.woff2`로 self-host (weight 45–920 가변).
- 
----
- 
-## 모서리 반경 (Radius)
- 
-기준값 `--radius: 0.625rem` (10px). 나머지는 배수로 계산됨 (`@theme inline`).
- 
-| 토큰 | Tailwind 유틸 | 계산식 | 값 |
-|---|---|---|---|
-| `--radius-sm` | `rounded-sm` | `radius * 0.6` | `0.375rem` (6px) |
-| `--radius-md` | `rounded-md` | `radius * 0.8` | `0.5rem` (8px) |
-| `--radius-lg` | `rounded-lg` | `radius * 1.0` | `0.625rem` (10px) |
-| `--radius-xl` | `rounded-xl` | `radius * 1.4` | `0.875rem` (14px) |
-| `--radius-2xl` | `rounded-2xl` | `radius * 1.8` | `1.125rem` (18px) |
-| `--radius-3xl` | `rounded-3xl` | `radius * 2.2` | `1.375rem` (22px) |
-| `--radius-4xl` | `rounded-4xl` | `radius * 2.6` | `1.625rem` (26px) |
- 
----
- 
-## 기타
- 
-- **스크롤바**: 6px, thumb = `--border`, hover thumb = `--muted-foreground` (webkit)
-- **전역 전환**: `body`에 `background-color/color 0.2s ease` (테마 전환용)
-- **다크 모드**: `.dark` 클래스 기반 (`@custom-variant dark`)
-- **간격(spacing)**: 별도 토큰 정의 없음 — Tailwind 기본 스케일 사용
\ No newline at end of file
diff --git a/front/src/index.css b/front/src/index.css
index db58488..d935dd2 100644
--- a/front/src/index.css
+++ b/front/src/index.css
@@ -5,7 +5,7 @@
 /* ============================================================
    디자인 토큰 (출처: design.md)
    - 이 프로젝트는 다크모드 없음 → light 값만 사용 (.dark / @custom-variant 미사용)
-   - 차트(--chart-*) 미사용 → 정의하지 않음
+   - 차트(--chart-*) / 사이드바(--sidebar-*) 미사용 → 정의하지 않음
    ============================================================ */
 :root {
   color-scheme: light;
@@ -43,16 +43,6 @@
   --destructive: #e7000b;
   --success: #10b981;
   --warning: #f59e0b;
-
-  /* --- 사이드바 --- */
-  --sidebar: #fafafa;
-  --sidebar-foreground: #0a0a0a;
-  --sidebar-primary: #171717;
-  --sidebar-primary-foreground: #fafafa;
-  --sidebar-accent: #f5f5f5;
-  --sidebar-accent-foreground: #171717;
-  --sidebar-border: #e5e5e5;
-  --sidebar-ring: var(--brand-500);   /* 포커스 링 = 브랜드 light(500), --ring 과 통일 */
 }
 
 /* ============================================================
@@ -87,16 +77,6 @@
   --color-success: var(--success);
   --color-warning: var(--warning);
 
-  /* 사이드바 */
-  --color-sidebar: var(--sidebar);
-  --color-sidebar-foreground: var(--sidebar-foreground);
-  --color-sidebar-primary: var(--sidebar-primary);
-  --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
-  --color-sidebar-accent: var(--sidebar-accent);
-  --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
-  --color-sidebar-border: var(--sidebar-border);
-  --color-sidebar-ring: var(--sidebar-ring);
-
   /* 폰트 */
   --font-sans: 'Pretendard Variable', 'Geist Variable', system-ui, sans-serif;
   --font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, monospace;