810485ecc8
---ci--- phase: 7 milestone: v0.1 status: complete requirements: covered: [REQ-001, REQ-002, REQ-003, REQ-004, REQ-005, REQ-006, REQ-007, REQ-008, REQ-009, REQ-010, REQ-011, REQ-012, REQ-013, REQ-014, REQ-015, REQ-016, REQ-017, REQ-018, REQ-019, REQ-020, REQ-021, REQ-022, REQ-023, REQ-024, REQ-025, REQ-026, REQ-027, REQ-028] partial: [] ---/ci--- Milestone v0.1 (nextcraft-ui-prototype) complete. Summary: - 7 phases (P0 pre-execution + P1-P6 execution + P7 final review) - 28 requirements covered (all complete) - 4 surfaces: Learner (7 pages), Marketplace (5), Employer Dashboard (4), Admin (4) - 19 routes, 104 TypeScript files - Shared component library (5 primitives + design tokens) - Mock data: 5 competency stacks (70 competencies), 20 jobs, 15 candidates, 10 employers - Tech: Next.js 15, Tailwind CSS v4, lucide-react, recharts, @xyflow/react, Inter font - Storybook with 6 stories - Dark mode, breadcrumbs, role switcher, responsive design - Build passes, typecheck passes, Storybook build passes Phases: P0 pre-execution → v0.0.1 P1 project-scaffolding → v0.0.2 P2 learner-surface → v0.0.3 P3 marketplace-surface → v0.0.4 P4 employer-dashboard → v0.0.5 P5 admin-surface → v0.0.6 P6 polish-integration → v0.0.7 P7 final-review-ship → v0.1.0 (milestone release)
58 lines
1.3 KiB
CSS
58 lines
1.3 KiB
CSS
@import 'tailwindcss';
|
|
|
|
/* Use class-based dark mode: the `dark:` variant responds to a `.dark`
|
|
class on <html> (toggled by ThemeProvider) instead of the OS
|
|
prefers-color-scheme media query. */
|
|
@custom-variant dark (&:where(.dark, .dark *));
|
|
|
|
@theme {
|
|
--font-sans: 'Inter', ui-sans-serif, system-ui, sans-serif;
|
|
|
|
--color-primary-50: #eef2ff;
|
|
--color-primary-100: #e0e7ff;
|
|
--color-primary-200: #c7d2fe;
|
|
--color-primary-300: #a5b4fc;
|
|
--color-primary-400: #818cf8;
|
|
--color-primary-500: #6366f1;
|
|
--color-primary-600: #4f46e5;
|
|
--color-primary-700: #4338ca;
|
|
--color-primary-800: #3730a3;
|
|
--color-primary-900: #312e81;
|
|
--color-primary-950: #1e1b4b;
|
|
|
|
--color-accent-50: #ecfdf5;
|
|
--color-accent-100: #d1fae5;
|
|
--color-accent-200: #a7f3d0;
|
|
--color-accent-300: #6ee7b7;
|
|
--color-accent-400: #34d399;
|
|
--color-accent-500: #10b981;
|
|
--color-accent-600: #059669;
|
|
--color-accent-700: #047857;
|
|
--color-accent-800: #065f46;
|
|
--color-accent-900: #064e3b;
|
|
--color-accent-950: #022c22;
|
|
|
|
--radius-sm: 4px;
|
|
--radius-md: 8px;
|
|
--radius-lg: 12px;
|
|
--radius-xl: 16px;
|
|
}
|
|
|
|
@layer base {
|
|
html {
|
|
font-family: var(--font-sans);
|
|
color-scheme: light;
|
|
}
|
|
|
|
html.dark {
|
|
color-scheme: dark;
|
|
}
|
|
|
|
body {
|
|
@apply bg-white text-slate-900 antialiased;
|
|
}
|
|
|
|
html.dark body {
|
|
@apply bg-slate-950 text-slate-100;
|
|
}
|
|
} |