feat(ui): polish Config Editor with Deep Space styling

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Jason Staack
2026-03-16 17:44:18 -05:00
parent 8fadfc4d7d
commit 64dc6beb11
3 changed files with 7 additions and 7 deletions

View File

@@ -136,7 +136,7 @@ export function CommandExecutor({ tenantId, deviceId, currentPath }: CommandExec
{results.length > 0 && (
<div className="max-h-48 overflow-y-auto space-y-2">
{results.map((r, i) => (
<div key={i} className="rounded border border-border bg-surface/50 p-2">
<div key={i} className="bg-surface border-border rounded-md font-mono text-xs p-2 border">
<div className="flex items-center gap-2 mb-1">
<span className="text-[10px] text-text-muted">{r.timestamp}</span>
<span className="text-xs font-mono text-text-secondary">{r.command}</span>

View File

@@ -107,17 +107,17 @@ export function EntryTable({
<div className="overflow-x-auto rounded-lg border border-border">
<table className="w-full text-xs">
<thead>
<tr className="border-b border-border bg-surface">
<tr className="border-b border-border">
{columns.map((col) => (
<th
key={col}
className="text-left px-3 py-2 text-text-secondary font-medium whitespace-nowrap"
className="text-left px-3 py-2 text-[10px] uppercase tracking-wider font-semibold text-text-muted whitespace-nowrap"
>
{col}
</th>
))}
{writable && (
<th className="text-right px-3 py-2 text-text-secondary font-medium w-20">
<th className="text-right px-3 py-2 text-[10px] uppercase tracking-wider font-semibold text-text-muted w-20">
Actions
</th>
)}

View File

@@ -157,7 +157,7 @@ function TreeItem({
className={cn(
'flex items-center gap-1.5 w-full px-2 py-1 text-xs rounded transition-colors',
isActive
? 'bg-elevated text-text-primary'
? 'bg-[hsl(var(--accent-muted))] text-accent'
: 'text-text-secondary hover:text-text-primary hover:bg-elevated/50',
)}
style={{ paddingLeft: `${depth * 12 + 8}px` }}
@@ -205,7 +205,7 @@ export function MenuTree({ onPathSelect, currentPath }: MenuTreeProps) {
return (
<div className="flex flex-col h-full">
<div className="px-2 py-2 border-b border-border">
<div className="text-[10px] uppercase tracking-wider text-text-muted mb-1">Menu</div>
<div className="text-[10px] uppercase tracking-wider font-semibold text-text-muted mb-1">Menu</div>
</div>
<div className="flex-1 overflow-y-auto py-1">
{MENU_TREE.map((node) => (
@@ -218,7 +218,7 @@ export function MenuTree({ onPathSelect, currentPath }: MenuTreeProps) {
))}
</div>
<div className="px-2 py-2 border-t border-border">
<div className="text-[10px] uppercase tracking-wider text-text-muted mb-1">Custom path</div>
<div className="text-[10px] uppercase tracking-wider font-semibold text-text-muted mb-1">Custom path</div>
<Input
value={customPath}
onChange={(e) => setCustomPath(e.target.value)}