- Install shadcn/ui dependencies (CVA, clsx, tailwind-merge, lucide-react) - Install Radix UI primitives (slot, label) - Create utility helper (lib/utils.ts with cn function) - Update Tailwind config for shadcn/ui theme support - Add CSS variables for theming in globals.css (Tailwind v4 syntax) - Add shadcn/ui components: Button, Card, Input, Label - Update JourneyForm with shadcn/ui components and icons - Update DataPreview with shadcn/ui components and icons - Improve UI consistency and accessibility 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
38 lines
1.1 KiB
CSS
38 lines
1.1 KiB
CSS
@import "tailwindcss";
|
|
|
|
@theme {
|
|
--color-background: 0 0% 100%;
|
|
--color-foreground: 222.2 84% 4.9%;
|
|
--color-card: 0 0% 100%;
|
|
--color-card-foreground: 222.2 84% 4.9%;
|
|
--color-popover: 0 0% 100%;
|
|
--color-popover-foreground: 222.2 84% 4.9%;
|
|
--color-primary: 221.2 83.2% 53.3%;
|
|
--color-primary-foreground: 210 40% 98%;
|
|
--color-secondary: 210 40% 96.1%;
|
|
--color-secondary-foreground: 222.2 47.4% 11.2%;
|
|
--color-muted: 210 40% 96.1%;
|
|
--color-muted-foreground: 215.4 16.3% 46.9%;
|
|
--color-accent: 210 40% 96.1%;
|
|
--color-accent-foreground: 222.2 47.4% 11.2%;
|
|
--color-destructive: 0 84.2% 60.2%;
|
|
--color-destructive-foreground: 210 40% 98%;
|
|
--color-border: 214.3 31.8% 91.4%;
|
|
--color-input: 214.3 31.8% 91.4%;
|
|
--color-ring: 221.2 83.2% 53.3%;
|
|
--radius: 0.5rem;
|
|
}
|
|
|
|
* {
|
|
box-sizing: border-box;
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
body {
|
|
font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
|
|
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
|
min-height: 100vh;
|
|
color: hsl(var(--color-foreground));
|
|
}
|