Pjot/frankenbot
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat: Complete UX cleanup - Agent colors & streamlined navigation

Browse source 
Agent Color System:
- Added unique colors for each agent (orchestrator: purple, researcher: teal, negotiator: red, ar_manager: yellow)
- CSS variables and utility classes (.agent-*, .agent-badge-*, .agent-border-*)
- Tasks table now shows colored left border per agent
- Agent names displayed in their brand color

Navigation Simplification:
- Removed 'Email Log' from main menu (reduced clutter)
- Email Log now accessible via link in Emails page
- Active state for both /emails and /email-log on Emails nav item

Visual Improvements:
- Agent assignments now visually distinct at a glance
- Cleaner, more focused navigation menu
- Better information architecture
This commit is contained in:
pdyde 2026-02-21 15:06:32 +01:00
parent 50c1a0315b
commit dc2ea07621
4 changed files with 45 additions and 8 deletions
Download patch file Download diff file Expand all files Collapse all files

24
static/style.css
View file

@ -29,6 +29,13 @@
--radius-sm: 9px;
--radius-xs: 6px;
--transition: .18s cubic-bezier(.4,0,.2,1);
/* Agent Colors */
--agent-orchestrator: #7c6fff;
--agent-researcher: #06d6a0;
--agent-negotiator: #f43f5e;
--agent-ar_manager: #fbbf24;
--agent-default: #38bdf8;
}
/* ── Reset & Base ─────────────────────────────────────────────────────────── */
@ -710,6 +717,23 @@ hr { border-color: var(--border); opacity: 1; }
pointer-events: none;
}
/* ── Agent Color System ─────────────────────────────────────────────────────── */
.agent-orchestrator { color: var(--agent-orchestrator) !important; }
.agent-researcher { color: var(--agent-researcher) !important; }
.agent-negotiator { color: var(--agent-negotiator) !important; }
.agent-ar_manager { color: var(--agent-ar_manager) !important; }
.agent-badge-orchestrator { background-color: var(--agent-orchestrator) !important; }
.agent-badge-researcher { background-color: var(--agent-researcher) !important; }
.agent-badge-negotiator { background-color: var(--agent-negotiator) !important; }
.agent-badge-ar_manager { background-color: var(--agent-ar_manager) !important; }
.agent-border-orchestrator { border-left: 3px solid var(--agent-orchestrator); }
.agent-border-researcher { border-left: 3px solid var(--agent-researcher); }
.agent-border-negotiator { border-left: 3px solid var(--agent-negotiator); }
.agent-border-ar_manager { border-left: 3px solid var(--agent-ar_manager); }
/* ── Responsive adjustments ───────────────────────────────────────────────── */
@media (max-width: 768px) {