fix(sidebar): distinct fuchsia notification dot for update indicator (#708)

The pulsing dot signaling an available image update used --info (blue
hue 250), the same hue as --label-blue, so the two blended visually
when a stack carried a blue label. Introduce a dedicated --update
token in vibrant fuchsia (hue 320) sitting outside the label palette,
and render both the sidebar StackRow and the fleet NodeManager
indicator as a notification-dot pattern (solid stationary core with
animate-ping halo). Aligns with the design rule that static state
should not pulse.
This commit is contained in:
Anso
2026-04-20 11:24:41 -04:00
committed by GitHub
parent af59836538
commit c7dfde4b79
4 changed files with 21 additions and 4 deletions
+5 -2
View File
@@ -602,8 +602,11 @@ export function NodeManager() {
)}
{(summary?.stacks_with_updates ?? 0) > 0 && (
<span className="flex items-center gap-1">
<span className="w-2 h-2 rounded-full bg-info animate-pulse" />
<span className="font-mono text-xs tabular-nums tracking-tight text-info">
<span className="relative inline-flex w-2 h-2 shrink-0">
<span className="absolute inset-0 rounded-full bg-update opacity-75 animate-ping" />
<span className="relative w-2 h-2 rounded-full bg-update" />
</span>
<span className="font-mono text-xs tabular-nums tracking-tight text-update">
{summary!.stacks_with_updates}
</span>
</span>
+6 -1
View File
@@ -72,7 +72,12 @@ export function StackRow(props: StackRowProps) {
)}
{hasUpdate && (
<RowTooltip
trigger={<span className="w-2 h-2 rounded-full bg-info animate-pulse" />}
trigger={(
<span className="relative inline-flex w-2 h-2 shrink-0">
<span className="absolute inset-0 rounded-full bg-update opacity-75 animate-ping" />
<span className="relative w-2 h-2 rounded-full bg-update" />
</span>
)}
label="Update available"
/>
)}