From 4836fd9932e1ebce53d73b0d095b448e2aafe6d8 Mon Sep 17 00:00:00 2001 From: Aziz FADIL Date: Sun, 15 Dec 2024 11:24:28 -0500 Subject: [PATCH] update tailwaindcss config --- tailwind.config.js | 185 ++++++++++++++++++++++----------------------- 1 file changed, 89 insertions(+), 96 deletions(-) diff --git a/tailwind.config.js b/tailwind.config.js index c8d8b2c..9fd32bf 100644 --- a/tailwind.config.js +++ b/tailwind.config.js @@ -1,7 +1,8 @@ -/** @type {import('tailwindcss').Config} */ -const { fontFamily } = require('tailwindcss/defaultTheme'); +import { fontFamily } from 'tailwindcss/defaultTheme'; +import tailwindcssAnimate from 'tailwindcss-animate'; -module.exports = { +/** @type {import('tailwindcss').Config} */ +export default { darkMode: ['class'], content: [ './pages/**/*.{ts,tsx}', @@ -10,98 +11,90 @@ module.exports = { './src/**/*.{ts,tsx}', ], theme: { - container: { - center: 'true', - padding: '2rem', - screens: { - '2xl': '1400px' - } - }, - extend: { - fontFamily: { - mono: ['IBM Plex Mono', ...fontFamily.mono] - }, - 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))' - }, - sidebar: { - DEFAULT: 'hsl(var(--sidebar))' - }, - success: { - DEFAULT: 'hsl(var(--success))', - foreground: 'hsl(var(--success-foreground))', - background: 'hsl(var(--success-background))' - }, - 'custom-green': '#E7EBCC', - 'custom-green-dark': '#606448' - }, - 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' - } - } - }, - animation: { - 'accordion-down': 'accordion-down 0.2s ease-out', - 'accordion-up': 'accordion-up 0.2s ease-out' - }, - gridTemplateColumns: { - sidebar: '200px auto', - 'sidebar-collapsed': '70px auto' - }, - width: { - sidebar: '220px', - 'sidebar-collapsed': '70px' - } - } + container: { + center: true, + padding: '2rem', + screens: { + '2xl': '1400px', + }, + }, + extend: { + fontFamily: { + mono: ['IBM Plex Mono', ...fontFamily.mono], + }, + 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))', + }, + sidebar: { + DEFAULT: 'hsl(var(--sidebar))', + }, + success: { + DEFAULT: 'hsl(var(--success))', + foreground: 'hsl(var(--success-foreground))', + background: 'hsl(var(--success-background))', + }, + 'custom-green': '#E7EBCC', + 'custom-green-dark': '#606448', + }, + 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' }, + }, + }, + animation: { + 'accordion-down': 'accordion-down 0.2s ease-out', + 'accordion-up': 'accordion-up 0.2s ease-out', + }, + gridTemplateColumns: { + sidebar: '200px auto', + 'sidebar-collapsed': '70px auto', + }, + width: { + sidebar: '220px', + 'sidebar-collapsed': '70px', + }, + }, }, - plugins: [require('tailwindcss-animate')], + plugins: [tailwindcssAnimate], };