feat(ui): sweep remaining components for Deep Space consistency
Replace old design tokens and hardcoded colors across 29 files: - bg-primary/text-primary-foreground -> bg-accent/text-white - text-muted-foreground -> text-text-muted - text-destructive/bg-destructive -> text-error/bg-error - bg-muted -> bg-elevated (background usage) - Hardcoded green/red/yellow/emerald/amber/slate -> semantic tokens - Remove shadow-md/lg from cards, tooltips, topology nodes - rounded-xl -> rounded-lg on cards/panels - focus:ring-1 focus:ring-ring -> focus:border-accent on inputs Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -99,8 +99,8 @@ function DeviceNode({ data }: NodeProps<DeviceNodeData>) {
|
||||
return (
|
||||
<div
|
||||
className={cn(
|
||||
'rounded-lg border bg-surface shadow-md px-3 py-2 min-w-[180px]',
|
||||
'transition-shadow hover:shadow-lg',
|
||||
'rounded-lg border bg-surface px-3 py-2 min-w-[180px]',
|
||||
'transition-colors',
|
||||
isOnline ? 'border-border' : 'border-error/30',
|
||||
)}
|
||||
>
|
||||
@@ -152,7 +152,7 @@ interface TooltipData {
|
||||
function NodeTooltip({ data }: { data: TooltipData; onClose?: () => void }) {
|
||||
return (
|
||||
<div
|
||||
className="absolute z-50 rounded-lg border border-border bg-elevated shadow-lg px-3 py-2 text-xs pointer-events-none"
|
||||
className="absolute z-50 rounded-lg border border-border bg-elevated px-3 py-2 text-xs pointer-events-none"
|
||||
style={{ left: data.x + 10, top: data.y - 10 }}
|
||||
>
|
||||
<div className="font-medium text-text-primary">{data.hostname}</div>
|
||||
@@ -339,7 +339,7 @@ export function TopologyMap({ tenantId }: TopologyMapProps) {
|
||||
>
|
||||
<Background color="hsl(var(--muted))" gap={20} size={1} />
|
||||
<Controls
|
||||
className="!bg-surface !border-border !shadow-md [&>button]:!bg-surface [&>button]:!border-border [&>button]:!text-text-secondary [&>button:hover]:!bg-elevated"
|
||||
className="!bg-surface !border-border [&>button]:!bg-surface [&>button]:!border-border [&>button]:!text-text-secondary [&>button:hover]:!bg-elevated"
|
||||
/>
|
||||
<MiniMap
|
||||
nodeColor={(node) => {
|
||||
|
||||
Reference in New Issue
Block a user