monoadmin/the-other-dude
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

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

Browse Source 
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
Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/src/components/config-editor/CommandExecutor.tsx
View File

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

6
frontend/src/components/config-editor/EntryTable.tsx
View File

@@ -107,17 +107,17 @@ export function EntryTable({
<div className="overflow-x-auto rounded-lg border border-border"> <div className="overflow-x-auto rounded-lg border border-border">
<table className="w-full text-xs"> <table className="w-full text-xs">
<thead> <thead>
<tr className="border-b border-border bg-surface"> <tr className="border-b border-border">
{columns.map((col) => ( {columns.map((col) => (
<th <th
key={col} 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} {col}
</th> </th>
))} ))}
{writable && ( {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 Actions
</th> </th>
)} )}

6
frontend/src/components/config-editor/MenuTree.tsx
View File

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