34 lines
1.5 KiB
TypeScript
34 lines
1.5 KiB
TypeScript
/**
|
|
* @file lib/constants/server.styles.ts
|
|
* @description Shared Tailwind CSS styling constants, color mappings, and active/inactive state utility classes for server navigation icons.
|
|
*/
|
|
|
|
/**
|
|
* Shared Tailwind CSS class constants mapping available server background color keys to their respective CSS utility classes.
|
|
*/
|
|
export const SERVER_COLOR_CLASSES: Record<string, string> = {
|
|
"bg-indigo-500": "bg-indigo-500",
|
|
"bg-emerald-500": "bg-emerald-500",
|
|
"bg-rose-500": "bg-rose-500",
|
|
"bg-amber-500": "bg-amber-500",
|
|
"bg-sky-500": "bg-sky-500",
|
|
"bg-violet-500": "bg-violet-500",
|
|
"bg-fuchsia-500": "bg-fuchsia-500",
|
|
"bg-cyan-500": "bg-cyan-500",
|
|
};
|
|
|
|
/**
|
|
* List of available color option class names for server icon selection.
|
|
* Dynamically generated from SERVER_COLOR_CLASSES to avoid duplicate maintenance.
|
|
*/
|
|
export const SERVER_COLOR_OPTIONS = Object.keys(SERVER_COLOR_CLASSES);
|
|
|
|
/**
|
|
* Common Tailwind CSS class constants defining base, active, and inactive visual states for server navigation icons.
|
|
*/
|
|
export const BASE_ICON_STYLES =
|
|
"w-12 h-12 flex items-center justify-center transition-all duration-200 shadow-md shrink-0";
|
|
export const ACTIVE_ICON_STYLES =
|
|
"rounded-xl ring-2 ring-accent ring-offset-2 ring-offset-surface cursor-default pointer-events-none opacity-100";
|
|
export const INACTIVE_ICON_STYLES =
|
|
"rounded-3xl opacity-80 hover:opacity-100 hover:rounded-xl hover:scale-105 hover:shadow-lg hover:ring-2 hover:ring-accent/40 cursor-pointer active:scale-95";
|