tailwind.config.js 2.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576
  1. import tailwindCssAnimate from 'tailwindcss-animate'
  2. /** @type {import('tailwindcss').Config} */
  3. export default {
  4. darkMode: ['class'],
  5. content: ['./index.html', './src/**/*.{ts,tsx,js,jsx}'],
  6. theme: {
  7. container: {
  8. center: 'true',
  9. padding: '2rem',
  10. screens: {
  11. '2xl': '1400px',
  12. },
  13. },
  14. extend: {
  15. borderRadius: {
  16. lg: 'var(--radius)',
  17. md: 'calc(var(--radius) - 2px)',
  18. sm: 'calc(var(--radius) - 4px)',
  19. },
  20. colors: {
  21. background: 'hsl(var(--background))',
  22. foreground: 'hsl(var(--foreground))',
  23. card: {
  24. DEFAULT: 'hsl(var(--card))',
  25. foreground: 'hsl(var(--card-foreground))',
  26. },
  27. popover: {
  28. DEFAULT: 'hsl(var(--popover))',
  29. foreground: 'hsl(var(--popover-foreground))',
  30. },
  31. primary: {
  32. DEFAULT: 'hsl(var(--primary))',
  33. foreground: 'hsl(var(--primary-foreground))',
  34. },
  35. secondary: {
  36. DEFAULT: 'hsl(var(--secondary))',
  37. foreground: 'hsl(var(--secondary-foreground))',
  38. },
  39. muted: {
  40. DEFAULT: 'hsl(var(--muted))',
  41. foreground: 'hsl(var(--muted-foreground))',
  42. },
  43. accent: {
  44. DEFAULT: 'hsl(var(--accent))',
  45. foreground: 'hsl(var(--accent-foreground))',
  46. },
  47. destructive: {
  48. DEFAULT: 'hsl(var(--destructive))',
  49. foreground: 'hsl(var(--destructive-foreground))',
  50. },
  51. border: 'hsl(var(--border))',
  52. input: 'hsl(var(--input))',
  53. ring: 'hsl(var(--ring))',
  54. chart: {
  55. 1: 'hsl(var(--chart-1))',
  56. 2: 'hsl(var(--chart-2))',
  57. 3: 'hsl(var(--chart-3))',
  58. 4: 'hsl(var(--chart-4))',
  59. 5: 'hsl(var(--chart-5))',
  60. },
  61. sidebar: {
  62. DEFAULT: 'hsl(var(--sidebar-background))',
  63. foreground: 'hsl(var(--sidebar-foreground))',
  64. primary: 'hsl(var(--sidebar-primary))',
  65. 'primary-foreground': 'hsl(var(--sidebar-primary-foreground))',
  66. accent: 'hsl(var(--sidebar-accent))',
  67. 'accent-foreground': 'hsl(var(--sidebar-accent-foreground))',
  68. border: 'hsl(var(--sidebar-border))',
  69. ring: 'hsl(var(--sidebar-ring))',
  70. },
  71. },
  72. },
  73. },
  74. plugins: [tailwindCssAnimate],
  75. }