| 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-indigo-700', | |
| iconBg: 'bg-indigo-200', | |
| }, | |
| teal: { | |
| bg: 'bg-teal-50', | |
| text: 'text-teal-900', | |
| gradient: 'bg-gradient-to-br from-teal-500 to-teal-700', | |
| iconBg: 'bg-teal-200', | |
| }, | |
| rose: { | |
| bg: 'bg-rose-50', | |
| text: 'text-rose-900', | |
| gradient: 'bg-gradient-to-br from-rose-500 to-rose-700', | |
| iconBg: 'bg-rose-200', | |
| }, | |
| amber: { | |
| bg: 'bg-amber-50', | |
| text: 'text-amber-900', | |
| gradient: 'bg-gradient-to-br from-amber-500 to-amber-700', | |
| iconBg: 'bg-amber-200', | |
| }, | |
| purple: { | |
| bg: 'bg-purple-50', | |
| text: 'text-purple-900', | |
| gradient: 'bg-gradient-to-br from-purple-500 to-purple-700', | |
| iconBg: 'bg-purple-200', | |
| }, | |
| blue: { | |
| bg: 'bg-blue-50', | |
| text: 'text-blue-900', | |
| gradient: 'bg-gradient-to-br from-blue-500 to-blue-700', | |
| iconBg: 'bg-blue-200', | |
| }, | |
| emerald: { | |
| bg: 'bg-emerald-50', | |
| text: 'text-emerald-900', | |
| gradient: 'bg-gradient-to-br from-emerald-500 to-emerald-700', | |
| iconBg: 'bg-emerald-200', | |
| }, | |
| fuchsia: { | |
| bg: 'bg-fuchsia-50', | |
| text: 'text-fuchsia-900', | |
| gradient: 'bg-gradient-to-br from-fuchsia-500 to-fuchsia-700', | |
| iconBg: 'bg-fuchsia-200', | |
| }, | |
| lime: { | |
| bg: 'bg-lime-50', | |
| text: 'text-lime-900', | |
| gradient: 'bg-gradient-to-br from-lime-500 to-lime-700', | |
| iconBg: 'bg-lime-200', | |
| }, | |
| sky: { | |
| bg: 'bg-sky-50', | |
| text: 'text-sky-900', | |
| gradient: 'bg-gradient-to-br from-sky-500 to-sky-700', | |
| 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', | |
| }; | |
| }; |