trading-platform-frontend-v2/tailwind.config.js
rckrdmrd 737303d177 Migración desde trading-platform/apps/frontend - Estándar multi-repo v2
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
2026-01-16 08:32:49 -06:00

143 lines
4.0 KiB
JavaScript

/** @type {import('tailwindcss').Config} */
export default {
darkMode: ["class"],
content: [
'./index.html',
'./src/**/*.{js,ts,jsx,tsx}',
],
prefix: "",
theme: {
container: {
center: true,
padding: "2rem",
screens: {
"2xl": "1400px",
},
},
extend: {
colors: {
// CSS Variables for theming
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))",
50: '#f9fafb',
100: '#f3f4f6',
200: '#e5e7eb',
300: '#d1d5db',
400: '#9ca3af',
500: '#6b7280',
600: '#4b5563',
700: '#374151',
800: '#1f2937',
900: '#111827', // Smart Trading Club primary black/gray
},
secondary: {
DEFAULT: "hsl(var(--secondary))",
foreground: "hsl(var(--secondary-foreground))",
},
gold: {
50: '#fffef7',
100: '#fffbeb',
200: '#fef3c7',
300: '#fde68a',
400: '#fcd34d',
500: '#fbbf24',
600: '#f59e0b',
700: '#d97706',
800: '#b45309',
900: '#92400e',
DEFAULT: '#ffd700', // Smart Trading Club gold
},
// VIP tier colors (mantener compatibilidad)
platinum: {
400: '#a3a3a3',
500: '#737373',
600: '#525252',
},
diamond: {
400: '#60a5fa',
500: '#3b82f6',
600: '#2563eb',
},
// Status colors
success: '#10b981',
danger: '#ef4444',
warning: '#f59e0b',
info: '#6b7280',
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))",
},
},
fontFamily: {
sans: ['Inter', 'system-ui', 'sans-serif'],
mono: ['JetBrains Mono', 'monospace'],
},
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" },
},
fadeIn: {
'0%': { opacity: '0' },
'100%': { opacity: '1' },
},
slideUp: {
'0%': { transform: 'translateY(10px)', opacity: '0' },
'100%': { transform: 'translateY(0)', opacity: '1' },
},
"fade-in": {
from: { opacity: "0" },
to: { opacity: "1" },
},
"slide-up": {
from: { transform: "translateY(10px)", opacity: "0" },
to: { transform: "translateY(0)", opacity: "1" },
},
},
animation: {
"accordion-down": "accordion-down 0.2s ease-out",
"accordion-up": "accordion-up 0.2s ease-out",
'fade-in': 'fadeIn 0.5s ease-in-out',
'slide-up': 'slideUp 0.3s ease-out',
'pulse-slow': 'pulse 3s cubic-bezier(0.4, 0, 0.6, 1) infinite',
},
},
},
plugins: [
require("tailwindcss-animate"),
require('@tailwindcss/forms'),
require('@tailwindcss/typography'),
],
};