| import type { Config } from "tailwindcss"; | |
| export default { | |
| darkMode: ["class"], | |
| content: [ | |
| "./pages/**/*.{ts,tsx}", | |
| "./components/**/*.{ts,tsx}", | |
| "./app/**/*.{ts,tsx}", | |
| "./src/**/*.{ts,tsx}", | |
| ], | |
| prefix: "", | |
| theme: { | |
| container: { | |
| center: true, | |
| padding: '2rem', | |
| screens: { | |
| '2xl': '1400px' | |
| } | |
| }, | |
| extend: { | |
| colors: { | |
| border: 'hsl(var(--border))', | |
| input: 'hsl(var(--input))', | |
| ring: 'hsl(var(--ring))', | |
| background: 'hsl(var(--background))', | |
| foreground: 'hsl(var(--foreground))', | |
| primary: { | |
| DEFAULT: 'hsl(var(--primary))', | |
| foreground: 'hsl(var(--primary-foreground))' | |
| }, | |
| secondary: { | |
| DEFAULT: 'hsl(var(--secondary))', | |
| foreground: 'hsl(var(--secondary-foreground))' | |
| }, | |
| destructive: { | |
| DEFAULT: 'hsl(var(--destructive))', | |
| foreground: 'hsl(var(--destructive-foreground))' | |
| }, | |
| muted: { | |
| DEFAULT: 'hsl(var(--muted))', | |
| foreground: 'hsl(var(--muted-foreground))' | |
| }, | |
| accent: { | |
| DEFAULT: 'hsl(var(--accent))', | |
| foreground: 'hsl(var(--accent-foreground))' | |
| }, | |
| popover: { | |
| DEFAULT: 'hsl(var(--popover))', | |
| foreground: 'hsl(var(--popover-foreground))' | |
| }, | |
| card: { | |
| DEFAULT: 'hsl(var(--card))', | |
| foreground: 'hsl(var(--card-foreground))' | |
| }, | |
| }, | |
| borderRadius: { | |
| lg: 'var(--radius)', | |
| md: 'calc(var(--radius) - 2px)', | |
| sm: 'calc(var(--radius) - 4px)' | |
| }, | |
| keyframes: { | |
| "accordion-down": { | |
| from: { height: '0' }, | |
| to: { height: 'var(--radix-accordion-content-height)' }, | |
| }, | |
| "accordion-up": { | |
| from: { height: 'var(--radix-accordion-content-height)' }, | |
| to: { height: '0' }, | |
| }, | |
| "fade-in": { | |
| "0%": { opacity: "0", transform: "translateY(10px)" }, | |
| "100%": { opacity: "1", transform: "translateY(0)" } | |
| }, | |
| "pulse-animation": { | |
| "0%": { transform: "scale(1)", opacity: "0.7" }, | |
| "50%": { transform: "scale(1.1)", opacity: "1" }, | |
| "100%": { transform: "scale(1)", opacity: "0.7" } | |
| }, | |
| "ping": { | |
| "75%, 100%": { transform: "scale(2)", opacity: "0" } | |
| } | |
| }, | |
| animation: { | |
| "accordion-down": "accordion-down 0.2s ease-out", | |
| "accordion-up": "accordion-up 0.2s ease-out", | |
| "fade-in": "fade-in 0.4s ease-out", | |
| "pulse": "pulse-animation 2s infinite ease-in-out", | |
| "ping": "ping 1.5s cubic-bezier(0, 0, 0.2, 1) infinite" | |
| } | |
| } | |
| }, | |
| plugins: [require("tailwindcss-animate")], | |
| } satisfies Config; | |