feat: comprehensive design system overhaul

Applied impeccable design critique, audit, harden, layout, distill, and polish across all pages.

DESIGN SYSTEM:
- Created PRODUCT.md (5 design principles, WCAG 2.1 AA target)
- Created DESIGN.md (34 color tokens, 6 radius scale, full component spec)
- Created .impeccable/design.json (sidecar with tonal ramps, shadows, motion)

ACCESSIBILITY:
- 33 aria-labels across 7 pages (was ~13)
- 63 <label> elements (was ~30)
- 6 <main> landmarks + role=navigation on all sidebars
- Esc to close modals on 4 pages
- Keyboard shortcuts (Ctrl+J/K, Ctrl+F) on chat

THEMING:
- 216 hardcoded colors replaced with var() references
- 449 !important removed from dark-mode.css
- Dark mode script unified (was duplicated 9x inline)
- All modals converted to .modal-overlay + .modal design system classes

CHAT:
- Error states for messages (.msg.erro, .msg.enviando)
- Connection status indicator
- Confirmation modal before finalizar
- Input bar reorganized (3 visible actions, + menu)
- Right panel accordions
- Send button disabled when empty
- Touch targets 44px on mobile

CLIENT DETAIL:
- Tabs/badges/sub-tabs use CSS classes instead of inline styles
- 'Iniciar Conversa' button now primary action
- alert() replaced with inline feedback
- Modal converted to design system classes

CLIENT LIST:
- Modal moved inside <body> (was HTML-invalid)
- alert() replaced with inline feedback
- Modal uses .show pattern

SETTINGS:
- 4 modals converted to design system classes
- 14 alert() calls replaced with inline feedback
- fecharModal() uses classList instead of style.display

ROUTES:
- border-radius normalized, hardcoded colors fixed

Score progression:
  Chat:        23 → 32/40
  Client List: 32 → 35/40
  Client Detail: 26 → 30/40
  Settings:     29 → 35/40
  Routes:       37 → 38/40
  Audit (project): 14/20 → 17/20
This commit is contained in:
2026-06-23 16:58:12 +00:00
parent cf720c37a1
commit 12d419de7c
113 changed files with 52423 additions and 951 deletions
@@ -0,0 +1,61 @@
#!/usr/bin/env node
/**
* Print durable recovery status for Impeccable live sessions.
*/
import { createLiveSessionStore } from './live/session-store.mjs';
import { readLiveServerInfo } from './lib/impeccable-paths.mjs';
import { manualApplyResumeHint } from './live-resume.mjs';
function readServerInfo() {
return readLiveServerInfo(process.cwd())?.info || null;
}
async function fetchServerStatus(info) {
if (!info) return null;
try {
const res = await fetch(`http://localhost:${info.port}/status?token=${info.token}`);
if (!res.ok) return null;
return await res.json();
} catch {
return null;
}
}
export async function statusCli() {
const info = readServerInfo();
const server = await fetchServerStatus(info);
const store = createLiveSessionStore({ cwd: process.cwd() });
const activeSessions = store.listActiveSessions();
const manualApply = findPendingManualApply(server, activeSessions);
const payload = {
liveServer: server ? {
status: server.status,
port: server.port,
connectedClients: server.connectedClients,
agentPolling: server.agentPolling,
pendingEvents: server.pendingEvents,
} : null,
activeSessions: server?.activeSessions || activeSessions,
recoveryHint: manualApply
? manualApplyResumeHint(manualApply)
: server
? 'Run live-poll.mjs to continue pending work, or live-complete.mjs --id <session> after manual cleanup.'
: 'Start live-server.mjs to requeue pending durable events, then run live-poll.mjs.',
};
console.log(JSON.stringify(payload, null, 2));
}
function findPendingManualApply(server, activeSessions) {
const fromServer = server?.pendingEvents?.find((event) => event?.type === 'manual_edit_apply');
if (fromServer) return fromServer;
const fromSession = activeSessions
?.map((session) => session.pendingEvent)
.find((event) => event?.type === 'manual_edit_apply');
return fromSession || null;
}
const _running = process.argv[1];
if (_running?.endsWith('live-status.mjs') || _running?.endsWith('live-status.mjs/')) {
statusCli();
}