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
+61
View File
@@ -0,0 +1,61 @@
#!/usr/bin/env node
/**
* Impeccable design hook — PostToolUse entry point.
*
* Reads the Claude Code / Codex / Cursor hook event from stdin, runs the design
* detector against the touched file, and emits a system reminder via
* `hookSpecificOutput.additionalContext` when findings exist.
*
* Contract: never break a turn. Always exit 0. Clean files emit a small ack
* unless quiet mode is enabled.
*
* Most logic lives in `hook-lib.mjs` so it is unit-testable without a
* subprocess. This file is the thin stdin/stdout adapter.
*/
import { runHook, writeAuditLog } from './hook-lib.mjs';
async function readStdin() {
if (process.stdin.isTTY) return '';
const chunks = [];
for await (const chunk of process.stdin) chunks.push(chunk);
return Buffer.concat(chunks).toString('utf-8');
}
async function main() {
// Snapshot the inherited env FIRST so the re-entrancy guard checks the
// parent's value, not the value we are about to export for any child
// processes the hook might ever spawn.
const inheritedEnv = { ...process.env };
process.env.IMPECCABLE_HOOK_DEPTH = process.env.IMPECCABLE_HOOK_DEPTH || '1';
let stdinJson = '';
try { stdinJson = await readStdin(); } catch { /* fall through */ }
const result = await runHook({
stdinJson,
env: inheritedEnv,
cwd: process.cwd(),
});
writeAuditLog(process.env, result.audit, process.cwd());
if (result.stdout) process.stdout.write(result.stdout);
process.exit(result.exitCode || 0);
}
main().catch((err) => {
// Last-ditch: never break the agent's turn even if something we did not
// anticipate goes wrong. Audit-log the failure if logging is enabled.
try {
writeAuditLog(process.env, {
ts: new Date().toISOString(),
event: 'PostToolUse',
error: String(err && err.message ? err.message : err),
});
} catch { /* swallow */ }
if (process.env.IMPECCABLE_HOOK_DEBUG) {
process.stderr.write(`[impeccable-hook] ${err}\n`);
}
process.exit(0);
});