| import { clsx, type ClassValue } from "clsx" | |
| import { twMerge } from "tailwind-merge" | |
| export function cn(...inputs: ClassValue[]) { | |
| return twMerge(clsx(inputs)) | |
| } | |
| export type ColorConfig = { | |
| bg: string; | |
| text: string; | |
| gradient: string; | |
| iconBg: string; | |
| }; | |
| export const colorConfigs: Record<string, ColorConfig> = { | |
| indigo: { | |
| bg: 'bg-indigo-50', | |
| text: 'text-indigo-900', | |
| gradient: 'bg-gradient-to-br from-indigo-500 to-purple-600', | |
| iconBg: 'bg-indigo-200', | |
| }, | |
| teal: { | |
| bg: 'bg-teal-50', | |
| text: 'text-teal-900', | |
| gradient: 'bg-gradient-to-br from-teal-400 to-emerald-600', | |
| iconBg: 'bg-teal-200', | |
| }, | |
| rose: { | |
| bg: 'bg-rose-50', | |
| text: 'text-rose-900', | |
| gradient: 'bg-gradient-to-br from-rose-400 to-pink-600', | |
| iconBg: 'bg-rose-200', | |
| }, | |
| amber: { | |
| bg: 'bg-amber-50', | |
| text: 'text-amber-900', | |
| gradient: 'bg-gradient-to-br from-amber-400 to-orange-500', | |
| iconBg: 'bg-amber-200', | |
| }, | |
| purple: { | |
| bg: 'bg-purple-50', | |
| text: 'text-purple-900', | |
| gradient: 'bg-gradient-to-br from-purple-400 to-indigo-600', | |
| iconBg: 'bg-purple-200', | |
| }, | |
| blue: { | |
| bg: 'bg-blue-50', | |
| text: 'text-blue-900', | |
| gradient: 'bg-gradient-to-br from-blue-400 to-cyan-600', | |
| iconBg: 'bg-blue-200', | |
| }, | |
| emerald: { | |
| bg: 'bg-emerald-50', | |
| text: 'text-emerald-900', | |
| gradient: 'bg-gradient-to-br from-emerald-400 to-green-600', | |
| iconBg: 'bg-emerald-200', | |
| }, | |
| fuchsia: { | |
| bg: 'bg-fuchsia-50', | |
| text: 'text-fuchsia-900', | |
| gradient: 'bg-gradient-to-br from-fuchsia-400 to-pink-600', | |
| iconBg: 'bg-fuchsia-200', | |
| }, | |
| lime: { | |
| bg: 'bg-lime-50', | |
| text: 'text-lime-900', | |
| gradient: 'bg-gradient-to-br from-lime-400 to-green-500', | |
| iconBg: 'bg-lime-200', | |
| }, | |
| sky: { | |
| bg: 'bg-sky-50', | |
| text: 'text-sky-900', | |
| gradient: 'bg-gradient-to-br from-sky-400 to-blue-600', | |
| iconBg: 'bg-sky-200', | |
| }, | |
| }; | |
| export const getColorConfig = (colorName: string): ColorConfig => { | |
| return colorConfigs[colorName] || { | |
| bg: 'bg-gray-200', | |
| text: 'text-gray-800', | |
| gradient: 'bg-gradient-to-br from-gray-500 to-gray-700', | |
| iconBg: 'bg-gray-200', | |
| }; | |
| }; |