Files
MIKROTIK-RMM/frontend/tailwind.config.js

73 lines
2.2 KiB
JavaScript

/** @type {import('tailwindcss').Config} */
export default {
darkMode: 'class',
content: ['./index.html', './src/**/*.{js,ts,jsx,tsx}'],
theme: {
extend: {
colors: {
// Legacy brand palette — kept for backward compat with existing components
brand: {
50: '#eff6ff',
100: '#dbeafe',
200: '#bfdbfe',
300: '#93c5fd',
400: '#60a5fa',
500: '#3b82f6',
600: '#2563eb',
700: '#1d4ed8',
800: '#1e40af',
900: '#1e3a8a',
},
sidebar: {
light: '#f1f5f9',
dark: '#0f172a',
},
// Design token colors — reference CSS vars so light/dark switch automatically
bg: 'var(--bg)',
surface: 'var(--surface)',
'surface-2': 'var(--surface-2)',
'surface-3': 'var(--surface-3)',
line: 'var(--line)',
'line-soft': 'var(--line-soft)',
ink: 'var(--ink)',
'ink-2': 'var(--ink-2)',
'ink-3': 'var(--ink-3)',
'ink-4': 'var(--ink-4)',
accent: 'var(--accent)',
'accent-2': 'var(--accent-2)',
'accent-soft': 'var(--accent-soft)',
good: 'var(--good)',
warn: 'var(--warn)',
bad: 'var(--bad)',
info: 'var(--info)',
violet: 'var(--violet)',
},
fontFamily: {
sans: ['Geist', 'ui-sans-serif', 'system-ui', '-apple-system', 'sans-serif'],
mono: ['Geist Mono', 'ui-monospace', 'SFMono-Regular', 'Menlo', 'monospace'],
},
animation: {
'pulse-slow': 'pulse 3s cubic-bezier(0.4, 0, 0.6, 1) infinite',
'fade-in': 'fadeIn 0.2s ease-out',
'slide-in': 'slideIn 0.2s ease-out',
'glow-pulse': 'glowPulse 2s ease-in-out infinite',
},
keyframes: {
fadeIn: {
'0%': { opacity: '0' },
'100%': { opacity: '1' },
},
slideIn: {
'0%': { transform: 'translateX(-10px)', opacity: '0' },
'100%': { transform: 'translateX(0)', opacity: '1' },
},
glowPulse: {
'0%, 100%': { opacity: '1' },
'50%': { opacity: '0.4' },
},
},
},
},
plugins: [],
};