|
|
|
|
|
import type { Config } from 'tailwindcss'; |
|
|
|
|
|
const config = { |
|
|
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))", |
|
|
}, |
|
|
|
|
|
"netflix-red": "#E50914", |
|
|
"netflix-black": "#141414", |
|
|
"netflix-dark-gray": "#181818", |
|
|
"netflix-gray": "#808080", |
|
|
"netflix-light-gray": "#b3b3b3", |
|
|
|
|
|
|
|
|
"theme-primary": "var(--theme-primary, #E50914)", |
|
|
"theme-primary-hover": "var(--theme-primary-hover, #B81D24)", |
|
|
"theme-primary-light": "var(--theme-primary-light, #F5222D)", |
|
|
"theme-secondary": "var(--theme-secondary, #6D6D6D)", |
|
|
"theme-background": "var(--theme-background, #141414)", |
|
|
"theme-background-dark": "var(--theme-background-dark, #0A0A0A)", |
|
|
"theme-background-light": "var(--theme-background-light, #181818)", |
|
|
"theme-surface": "var(--theme-surface, #222222)", |
|
|
"theme-text": "var(--theme-text, #FFFFFF)", |
|
|
"theme-text-secondary": "var(--theme-text-secondary, #B3B3B3)", |
|
|
"theme-border": "var(--theme-border, #303030)", |
|
|
"theme-divider": "var(--theme-divider, #2D2D2D)", |
|
|
"theme-error": "var(--theme-error, #FF574D)", |
|
|
"theme-warning": "var(--theme-warning, #FFB01F)", |
|
|
"theme-success": "var(--theme-success, #48BB78)", |
|
|
"theme-info": "var(--theme-info, #38B2AC)" |
|
|
}, |
|
|
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)" } |
|
|
}, |
|
|
"fade-out": { |
|
|
"0%": { opacity: "1", transform: "translateY(0)" }, |
|
|
"100%": { opacity: "0", transform: "translateY(10px)" } |
|
|
}, |
|
|
"scale-in": { |
|
|
"0%": { transform: "scale(0.95)", opacity: "0" }, |
|
|
"100%": { transform: "scale(1)", opacity: "1" } |
|
|
}, |
|
|
"scale-out": { |
|
|
from: { transform: "scale(1)", opacity: "1" }, |
|
|
to: { transform: "scale(0.95)", opacity: "0" } |
|
|
}, |
|
|
"slide-in": { |
|
|
"0%": { transform: "translateX(100%)" }, |
|
|
"100%": { transform: "translateX(0)" } |
|
|
}, |
|
|
"slide-out": { |
|
|
"0%": { transform: "translateX(0)" }, |
|
|
"100%": { transform: "translateX(100%)" } |
|
|
}, |
|
|
}, |
|
|
animation: { |
|
|
"accordion-down": "accordion-down 0.2s ease-out", |
|
|
"accordion-up": "accordion-up 0.2s ease-out", |
|
|
"fade-in": "fade-in 0.3s ease-out forwards", |
|
|
"fade-out": "fade-out 0.3s ease-out forwards", |
|
|
"scale-in": "scale-in 0.2s ease-out", |
|
|
"scale-out": "scale-out 0.2s ease-out", |
|
|
"slide-in": "slide-in 0.3s ease-out", |
|
|
"slide-out": "slide-out 0.3s ease-out", |
|
|
}, |
|
|
}, |
|
|
}, |
|
|
plugins: [require("tailwindcss-animate")], |
|
|
} satisfies Config; |
|
|
|
|
|
export default config; |
|
|
|
