CIAgent
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)
38 lines
1002 B
TypeScript
38 lines
1002 B
TypeScript
import type { Preview } from '@storybook/react';
|
|
import '../app/globals.css';
|
|
|
|
/**
|
|
* Storybook preview — imports the app's Tailwind stylesheet so stories
|
|
* render with the full design-token system (colors, fonts, dark mode).
|
|
*/
|
|
const preview: Preview = {
|
|
parameters: {
|
|
controls: {
|
|
matchers: {
|
|
color: /(background|color)$/i,
|
|
date: /Date$/i,
|
|
},
|
|
},
|
|
backgrounds: {
|
|
default: 'light',
|
|
values: [
|
|
{ name: 'light', value: '#ffffff' },
|
|
{ name: 'dark', value: '#020617' },
|
|
],
|
|
},
|
|
layout: 'padded',
|
|
},
|
|
// Apply the `dark` class to the story root when the dark background is
|
|
// active so class-based dark: variants resolve.
|
|
decorators: [
|
|
(Story, context) => {
|
|
const isDark = context.globals?.backgrounds?.value === '#020617';
|
|
if (typeof document !== 'undefined') {
|
|
document.documentElement.classList.toggle('dark', isDark);
|
|
}
|
|
return <Story />;
|
|
},
|
|
],
|
|
};
|
|
|
|
export default preview; |