refactor(design): strip color bars from org chart cards
Remove the ink-blue top rank bar, running-state border override, and green glow shadow from org chart cards. The tree layout already communicates rank by position, and a dashed ink-blue connection line plus the bottom-right status dot + ping animation already mark running agents — duplicating the signal through a card-wide color band and a cyan/green shadow was pure decoration. - Drop the rounded-t [4px bg-primary | 2px bg-border] top bar entirely. - Running state stops overriding border to var(--primary); all running cards fall back to the neutral border-border like everyone else. - Running state stops emitting a success-tinted glow (shadow-[0_0_12px color-mix(... var(--success) 15% ...)]) — kami rule 8 bans drop shadows, and the tint introduced an unauthorized green. - Hover switches from shadow-lg + translate-y-0.5 to a subtle hover:bg-muted/30 tint. - Active/running avatar circle switches from bg-success-muted text-success to bg-accent text-primary (kami's ink-blue tint), removing the last green chrome on the page. - Heartbeat icon switches from text-success to text-primary. - Avatar initials move from font-bold (700) to font-semibold (600). Error / pending_approval keep their destructive border (red), since kami reserves the warm terra red for genuine error/destructive state per design.md color system. Typecheck and build:verify clean.
This commit is contained in:
1 parent
a5caecbfda
commit
86e9c215f1
1 file changed
+1
-1
@@ -158,7 +158,7 @@ export function OrgChart({ agents, connectors, onSelectAgent }: { agents: AgentR
|
||||
<span className="mt-0.5 text-[11px] leading-tight text-muted-foreground">{node.agent.title || node.agent.role}</span>
|
||||
<div className="mt-1.5 flex items-center gap-2">
|
||||
<span className="rounded bg-muted px-1.5 py-0.5 text-[11px] font-semibold tracking-tight text-muted-foreground">{connectorLabel}</span>
|
||||
{node.agent.heartbeatEnabled ? <Heartbeat size={10} className="text-success" /> : null}
|
||||
{node.agent.heartbeatEnabled ? <Heartbeat size={10} className="text-primary" /> : null}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in new issue
Block a user