tailwind.config.ts 2.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596
  1. import type { Config } from "tailwindcss";
  2. export default {
  3. darkMode: ["class"],
  4. content: [
  5. "./pages/**/*.{ts,tsx}",
  6. "./components/**/*.{ts,tsx}",
  7. "./app/**/*.{ts,tsx}",
  8. "./src/**/*.{ts,tsx}",
  9. ],
  10. prefix: "",
  11. theme: {
  12. container: {
  13. center: true,
  14. padding: '2rem',
  15. screens: {
  16. '2xl': '1400px'
  17. }
  18. },
  19. extend: {
  20. colors: {
  21. border: 'hsl(var(--border))',
  22. input: 'hsl(var(--input))',
  23. ring: 'hsl(var(--ring))',
  24. background: 'hsl(var(--background))',
  25. foreground: 'hsl(var(--foreground))',
  26. primary: {
  27. DEFAULT: 'hsl(var(--primary))',
  28. foreground: 'hsl(var(--primary-foreground))'
  29. },
  30. secondary: {
  31. DEFAULT: 'hsl(var(--secondary))',
  32. foreground: 'hsl(var(--secondary-foreground))'
  33. },
  34. destructive: {
  35. DEFAULT: 'hsl(var(--destructive))',
  36. foreground: 'hsl(var(--destructive-foreground))'
  37. },
  38. muted: {
  39. DEFAULT: 'hsl(var(--muted))',
  40. foreground: 'hsl(var(--muted-foreground))'
  41. },
  42. accent: {
  43. DEFAULT: 'hsl(var(--accent))',
  44. foreground: 'hsl(var(--accent-foreground))'
  45. },
  46. popover: {
  47. DEFAULT: 'hsl(var(--popover))',
  48. foreground: 'hsl(var(--popover-foreground))'
  49. },
  50. card: {
  51. DEFAULT: 'hsl(var(--card))',
  52. foreground: 'hsl(var(--card-foreground))'
  53. },
  54. sidebar: {
  55. DEFAULT: 'hsl(var(--sidebar-background))',
  56. foreground: 'hsl(var(--sidebar-foreground))',
  57. primary: 'hsl(var(--sidebar-primary))',
  58. 'primary-foreground': 'hsl(var(--sidebar-primary-foreground))',
  59. accent: 'hsl(var(--sidebar-accent))',
  60. 'accent-foreground': 'hsl(var(--sidebar-accent-foreground))',
  61. border: 'hsl(var(--sidebar-border))',
  62. ring: 'hsl(var(--sidebar-ring))'
  63. }
  64. },
  65. borderRadius: {
  66. lg: 'var(--radius)',
  67. md: 'calc(var(--radius) - 2px)',
  68. sm: 'calc(var(--radius) - 4px)'
  69. },
  70. keyframes: {
  71. 'accordion-down': {
  72. from: {
  73. height: '0'
  74. },
  75. to: {
  76. height: 'var(--radix-accordion-content-height)'
  77. }
  78. },
  79. 'accordion-up': {
  80. from: {
  81. height: 'var(--radix-accordion-content-height)'
  82. },
  83. to: {
  84. height: '0'
  85. }
  86. }
  87. },
  88. animation: {
  89. 'accordion-down': 'accordion-down 0.2s ease-out',
  90. 'accordion-up': 'accordion-up 0.2s ease-out'
  91. }
  92. }
  93. },
  94. plugins: [require("tailwindcss-animate")],
  95. } satisfies Config;