Sergei
4b60a92777
- Set up Tailwind CSS configuration for styling - Create Button component with variants (primary, secondary, outline, ghost, danger) - Create Input component with label, error, and helper text support - Create Card component with composable subcomponents (Header, Title, Description, Content, Footer) - Create LoadingSpinner component with size and fullscreen options - Create ErrorMessage component with retry and dismiss actions - Add comprehensive test suite using Jest and React Testing Library - Configure ESLint and Jest for quality assurance All components follow consistent design patterns from mobile app and include proper TypeScript types and accessibility features. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
39 lines
796 B
JavaScript
39 lines
796 B
JavaScript
/** @type {import('tailwindcss').Config} */
|
|
module.exports = {
|
|
content: [
|
|
'./app/**/*.{js,ts,jsx,tsx,mdx}',
|
|
'./components/**/*.{js,ts,jsx,tsx,mdx}',
|
|
],
|
|
theme: {
|
|
extend: {
|
|
colors: {
|
|
primary: '#007AFF',
|
|
secondary: '#5856D6',
|
|
success: '#34C759',
|
|
warning: '#FF9500',
|
|
error: '#FF3B30',
|
|
background: '#FFFFFF',
|
|
surface: '#F2F2F7',
|
|
textPrimary: '#000000',
|
|
textSecondary: '#3C3C43',
|
|
textMuted: '#8E8E93',
|
|
},
|
|
borderRadius: {
|
|
sm: '8px',
|
|
md: '12px',
|
|
lg: '16px',
|
|
xl: '20px',
|
|
},
|
|
spacing: {
|
|
xs: '4px',
|
|
sm: '8px',
|
|
md: '16px',
|
|
lg: '24px',
|
|
xl: '32px',
|
|
'2xl': '48px',
|
|
},
|
|
},
|
|
},
|
|
plugins: [],
|
|
};
|