f22e9faae2
- Downgraded Tailwind CSS to version 3.4.17 for compatibility. - Updated various dependencies to resolve version conflicts and ensure smooth operation. - Added missing types for Node.js to enhance type safety. - Improved the theming system using CSS custom properties (variables) for better customization and dark mode support. - Refactored styles in `app.css` to improve maintainability and readability. Updated the color palette to enhance the user experience. - Updated the PostCSS configuration to use the new Tailwind CSS version. - Updated component styles to utilize the new theming system.
65 lines
2.0 KiB
JavaScript
65 lines
2.0 KiB
JavaScript
/** @type {import('tailwindcss').Config} */
|
|
export default {
|
|
content: [
|
|
'./src/**/*.{html,js,svelte,ts}',
|
|
],
|
|
darkMode: 'class',
|
|
theme: {
|
|
screens: {
|
|
'xs': '480px',
|
|
'sm': '640px',
|
|
'md': '768px',
|
|
'lg': '1024px',
|
|
'xl': '1280px',
|
|
'2xl': '1536px',
|
|
},
|
|
extend: {
|
|
colors: {
|
|
primary: {
|
|
50: 'rgb(var(--color-primary-50) / <alpha-value>)',
|
|
100: 'rgb(var(--color-primary-100) / <alpha-value>)',
|
|
200: 'rgb(var(--color-primary-200) / <alpha-value>)',
|
|
300: 'rgb(var(--color-primary-300) / <alpha-value>)',
|
|
400: 'rgb(var(--color-primary-400) / <alpha-value>)',
|
|
500: 'rgb(var(--color-primary-500) / <alpha-value>)',
|
|
600: 'rgb(var(--color-primary-600) / <alpha-value>)',
|
|
700: 'rgb(var(--color-primary-700) / <alpha-value>)',
|
|
800: 'rgb(var(--color-primary-800) / <alpha-value>)',
|
|
900: 'rgb(var(--color-primary-900) / <alpha-value>)',
|
|
},
|
|
background: {
|
|
DEFAULT: 'rgb(var(--color-background) / <alpha-value>)',
|
|
secondary: 'rgb(var(--color-background-secondary) / <alpha-value>)',
|
|
},
|
|
text: {
|
|
DEFAULT: 'rgb(var(--color-text) / <alpha-value>)',
|
|
secondary: 'rgb(var(--color-text-secondary) / <alpha-value>)',
|
|
muted: 'rgb(var(--color-text-muted) / <alpha-value>)',
|
|
},
|
|
border: {
|
|
DEFAULT: 'rgb(var(--color-border) / <alpha-value>)',
|
|
secondary: 'rgb(var(--color-border-secondary) / <alpha-value>)',
|
|
},
|
|
// Keep original colors for backward compatibility
|
|
blue: {
|
|
600: '#2563eb',
|
|
700: '#1d4ed8',
|
|
},
|
|
gray: {
|
|
50: '#f9fafb',
|
|
100: '#f3f4f6',
|
|
200: '#e5e7eb',
|
|
300: '#d1d5db',
|
|
400: '#9ca3af',
|
|
500: '#6b7280',
|
|
600: '#4b5563',
|
|
700: '#374151',
|
|
800: '#1f2937',
|
|
900: '#111827',
|
|
},
|
|
},
|
|
},
|
|
},
|
|
plugins: [],
|
|
}
|