Logan CusanoandClaude Opus 5.5
bf206334e3
UI_REDESIGN chunk 4 was never finished: 39 app/component files still used raw Tailwind greys, kept readable in light mode only by the !important override sheet. In dark mode text-gray-600 is ~2.3:1 on surface, and the light override maps it to #94a3b8 (~2.6:1 on white) — unreadable in both. Mechanical mapping (886 classes): gray-100/200 -> ink, 300/400 -> ink-2, 500/600/700 -> ink-muted, bg 950/900/800 -> page/surface/raised, border 800 -> line, 700/600 -> line-strong, plus hover/divide/placeholder. Alpha suffixes kept (tokens are color-mix, so /60 works). bg-gray-700, text-white and marketing pages left alone. text-[9px] -> text-[10px]. Frontend unverified: no Node on the authoring box (#207). Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
17 lines
657 B
TypeScript
17 lines
657 B
TypeScript
import type { NodeStatus } from "@/lib/types";
|
|
|
|
const styles: Record<NodeStatus, string> = {
|
|
online: "bg-green-950 text-green-400 border border-green-800",
|
|
recording: "bg-orange-950 text-orange-400 border border-orange-800 animate-pulse",
|
|
offline: "bg-surface text-ink-muted border border-line-strong",
|
|
unconfigured: "bg-indigo-950 text-indigo-400 border border-indigo-800",
|
|
};
|
|
|
|
export function StatusBadge({ status }: { status: NodeStatus }) {
|
|
return (
|
|
<span className={`inline-block px-2 py-0.5 rounded-full text-xs font-semibold uppercase tracking-wide ${styles[status] ?? styles.offline}`}>
|
|
{status}
|
|
</span>
|
|
);
|
|
}
|