725a3c5d84
- Add sidebar text color picker to Branding Settings page - Implement auto-calculated complementary text colors based on brand color luminance - Dark themes get light tinted text, light themes get dark tinted text - Add navigation preview showing text on gradient background - Support 10 new lighter color palettes (Soft Mint, Lavender, Peach, etc.) - Add CSS utility classes for brand-text with opacity support - Update sidebar and navigation components to use dynamic text colors - Add sidebar_text_color field to Tenant model with migration 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
33 lines
1.2 KiB
JavaScript
33 lines
1.2 KiB
JavaScript
/** @type {import('tailwindcss').Config} */
|
|
export default {
|
|
darkMode: 'media', // Follow browser's color scheme preference
|
|
content: [
|
|
"./index.html",
|
|
"./src/**/*.{js,ts,jsx,tsx}",
|
|
],
|
|
theme: {
|
|
extend: {
|
|
fontFamily: {
|
|
sans: ['Inter', 'sans-serif'],
|
|
},
|
|
colors: {
|
|
brand: {
|
|
50: 'var(--color-brand-50, #eff6ff)',
|
|
100: 'var(--color-brand-100, #dbeafe)',
|
|
200: 'var(--color-brand-200, #bfdbfe)',
|
|
300: 'var(--color-brand-300, #93c5fd)',
|
|
400: 'var(--color-brand-400, #60a5fa)',
|
|
500: 'var(--color-brand-500, #3b82f6)',
|
|
600: 'var(--color-brand-600, #2563eb)',
|
|
700: 'var(--color-brand-700, #1d4ed8)',
|
|
800: 'var(--color-brand-800, #1e40af)',
|
|
900: 'var(--color-brand-900, #1e3a8a)',
|
|
},
|
|
// Contrast text color for brand backgrounds (supports opacity modifiers like /70)
|
|
'brand-text': 'rgb(var(--color-brand-text-rgb, 255 255 255) / <alpha-value>)',
|
|
},
|
|
},
|
|
},
|
|
plugins: [],
|
|
}
|