- Code\rebar_pipeline, review_pipeline, pier-program을 정션에서 실제 폴더로 전환 - Code\rhino_mcp 및 CLAUDE_rhino배경.md 추가, .mcp.json은 PYTHONPATH로 새 위치 사용 - pier-program 내부 .git 제거(이력은 backup\pier-program_20261028.bundle에 보관) - worktree 가이드 반영(CLAUDE.local.md, HANDOFF.md) - D:\Rhino-MCP 경로 참조를 새 위치로 치환 Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
2.2 KiB
2.2 KiB
Design System Specification
Phase 5 Deliverable: Component system definition
Project: {{project_name}} Date: {{date}} Version: 1.0
1. Design Tokens
1.1 Colors
:root {
/* Primary */
--primary: #0066FF;
--primary-hover: #0052CC;
/* Neutral */
--background: #FFFFFF;
--foreground: #171717;
--muted: #F5F5F5;
/* Semantic */
--success: #22C55E;
--warning: #F59E0B;
--error: #EF4444;
}
1.2 Typography
| Name | Size | Weight | Usage |
|---|---|---|---|
| h1 | 36px | 700 | Page title |
| h2 | 24px | 600 | Section title |
| body | 16px | 400 | Body text |
| small | 14px | 400 | Helper text |
1.3 Spacing
4px, 8px, 12px, 16px, 24px, 32px, 48px, 64px
2. Component List
2.1 Basic Components
| Component | Status | Description |
|---|---|---|
| Button | ✅ | Button |
| Input | ✅ | Input field |
| Card | ✅ | Card container |
| Badge | ✅ | Badge/Tag |
| Avatar | ✅ | Avatar |
2.2 Form Components
| Component | Status | Description |
|---|---|---|
| Form | ✅ | Form wrapper |
| Label | ✅ | Label |
| Select | ✅ | Select dropdown |
| Checkbox | ✅ | Checkbox |
2.3 Feedback Components
| Component | Status | Description |
|---|---|---|
| Dialog | ✅ | Dialog/Modal |
| Toast | ✅ | Toast notification |
| Alert | ✅ | Alert banner |
3. Component Details
3.1 Button
Variants:
default: Default styleoutline: Border onlyghost: No backgrounddestructive: Delete/Danger action
Sizes:
sm: Small buttondefault: Default sizelg: Large button
Usage Example:
<Button variant="default" size="default">
Button
</Button>
<Button variant="outline" size="sm">
Small Button
</Button>
4. Installed Components
# shadcn/ui component installation log
npx shadcn@latest add button
npx shadcn@latest add input
npx shadcn@latest add card
# ...
5. Validation Checklist
- All required basic components exist
- Design tokens applied consistently
- Accessibility (a11y) considered
- Responsive design supported
6. Next Steps
Proceed to Phase 6: UI Implementation + API Integration