refactor: centralise color maps, org color fallback, and motion-safe transitions

Create src/lib/theme-colors.ts with DOT_COLORS, KPI_COLORS,
PROJECT_STATUS_COLORS, and DEFAULT_ORG_COLOR constants. Add
motionSafeTransition() utility to src/lib/utils.ts.

Removes 6 duplicate color map definitions across Card, DetailPanel,
PatientSummaryTile, KPIDetail, ProjectsTile, and ProjectDetail.
Replaces 9 hardcoded '#0D6E6E' fallbacks and 7 inline motion ternaries.
Fixes project status color inconsistency between ProjectsTile and
ProjectDetail (Ongoing was teal in tile, amber in detail).
This commit is contained in:
2026-02-17 01:58:10 +00:00
parent 296b18f025
commit 8f4ddc454a
16 changed files with 686 additions and 190 deletions
+10
View File
@@ -15,3 +15,13 @@ export function hexToRgba(hex: string, opacity: number): string {
}
export const prefersReducedMotion = window.matchMedia('(prefers-reduced-motion: reduce)').matches
/** Returns a framer-motion transition that respects prefers-reduced-motion */
export function motionSafeTransition(
duration: number,
ease: string = 'easeOut',
delay: number = 0
): { duration: number; ease?: string; delay?: number } {
if (prefersReducedMotion) return { duration: 0 }
return { duration, ease, ...(delay ? { delay } : {}) }
}