diff --git a/frontend/src/lib/components/copilot/chat/RunScriptCard.svelte b/frontend/src/lib/components/copilot/chat/RunScriptCard.svelte index e19342c4d1..317dfa7222 100644 --- a/frontend/src/lib/components/copilot/chat/RunScriptCard.svelte +++ b/frontend/src/lib/components/copilot/chat/RunScriptCard.svelte @@ -210,29 +210,30 @@ chatJob?.durationMs !== undefined ? msToReadableTime(chatJob.durationMs, 2) : '' ) - // The ink of the status badge the jobs bar shows for the same job (Badge's `colors`, - // through JobStatusIcon), on a row that stays transparent: the hue reads against both - // grounds instead of one. Hues follow the tray's own vocabulary — blue running, violet - // approval, orange queued, green ok, red fail. The card outlives its job and sometimes - // precedes it, so the states only it knows about read off its own flags instead. + // The hue of the status badge the jobs bar shows for the same job — blue running, violet + // approval, orange queued, green ok, red fail — at a weight sitting between the row's label + // and its title. Not the badge's ink: drawn for a tinted ground, it lands at twice the + // label's contrast here. The step differs per hue because this ramp is not uniform. const statusClass = $derived.by(() => { + // The card outlives its job and sometimes precedes it, so the states only it knows about + // read off its own flags rather than off a status no job is there to report. if (canceled) return 'text-tertiary' - if (failed) return 'text-red-800 dark:text-red-100' + if (failed) return 'text-red-800 dark:text-red-300' if (!ran) return 'text-tertiary' switch (chatJob?.status) { case 'running': - return 'text-blue-800 dark:text-blue-100' + return 'text-blue-800 dark:text-blue-200' case 'suspended': - return 'text-violet-800 dark:text-violet-100' + return 'text-violet-800 dark:text-violet-300' case 'queued': case 'scheduled': - return 'text-orange-800 dark:text-orange-100' + return 'text-orange-800 dark:text-orange-300' case 'failure': - return 'text-red-800 dark:text-red-100' + return 'text-red-800 dark:text-red-300' case 'success': - return 'text-green-700 dark:text-green-100' + return 'text-green-700 dark:text-green-400' default: - return settled ? 'text-green-700 dark:text-green-100' : 'text-blue-800 dark:text-blue-100' + return settled ? 'text-green-700 dark:text-green-400' : 'text-blue-800 dark:text-blue-200' } }) // How long it took, which is the one thing the colour cannot say. A run that never started