master
John Lauer 1.3.0: Dock Bar contract (serve --print-url, /api/status LEDs, CORS, say strip), settings modal, taskbar progress, pup vault for logins, adom-bridge + pup_* transport, dashboard overhaul per adom-ui-design, doctor for first run 83b2ae8 1mo ago

UI audit of src/ui/index.html (2026-08-23), against adom-ui-design

Linter (adom-ui-linter, ui-patterns/ai-drivability/header): FAIL UI-05 (20x text-transform uppercase), WARN UI-11 title= tooltips, WARN AI-02 no /console, FAIL AI-05/06 no User-Agent gate. The linter is lenient; the real problems are below.

  1. Header is three stacked rows (header 549-591, .toolbar 593-609, .project-tabs 611-613, .activity 615-620). header .actions (576) is EMPTY. Fix: ONE 44px three-zone row. Validation / Sourcing order / Architecture / Library folder become 28x28 monochrome icon buttons in .actions with tooltips, plus a settings cog (last). Credentials + auto-zoom move into the settings modal. Search + selects become one slim filter row. Activity bar duplicates the header FETCHING pill (728-731): delete .activity, keep the pill. Project tabs become pills on the filter row.
  2. Emoji/symbol glyphs used as icons: 603 βœ“, 604 β›“, 607 πŸ—Ί, 1104 ⟲, 1105 πŸ–Ό, 1107 –, 1535 β–Ύ, 1355 ●, 1374 βœ•, 1645/1738 ●, 1650 β–Ύ, 1791/1802 ⚠, 1762 β†—, 2102 βœ“, 2111 ⬇, 2113 πŸ“¦/πŸŒ‰ (34px .bm-icon at 430), 2158 πŸ—Ί, 2161 βœ•, 2194-2257 βœ“βœ—β­³β¬‡β†³β–Έ, badges 1068 Pin-1 ⚠, 1071 Pin-1 βœ“, 1085 βœ“ GOLDEN, 1090 ⚠ DIVERGENT, 1092 βœ— FAIL, 1094 β€” UNVAL; tooltips naming glyphs 741, 1094, 1137, 1562/1564; 587-588 β†—. Fix: inline 24-viewBox stroke SVGs with currentColor (the folder/zoom buttons at 606, 1118, 1119 already do it right). Validation table: 14px check/x SVG in --green/--red. Tooltip copy names the control.
  3. Em/en dashes (~55 user-visible): 566, 745 (idle subject placeholder), 569, 582 (β€” x2), 603, 607, 626, 628, 737, 819, 846, 963/1048 (data sentinel 'β€”', check what serve.rs/inventory.rs emit), 1003, 1031, 1037, 1039, 1085-1094, 1119, 1133, 1137, 1142, 1355, 1530, 1600-1602, 1643, 1649, 1795, 1801, 1925-1926, 1939, 1944, 2119, 2158, 2197, 2201, 2215, 2255, 2257, 2265, 2323. Fix: replace with : , . per context; idle subject becomes "No chip selected" in --text-2.
  4. Wrong teal #00b8b0 at 6 (favicon) and 60 (--accent); rgba(0,184,176,...) at 131, 257, 367, 368, 379, 393, 520, 532, 534, 1352, 2231, 2278, 2309, 2317. Fix: --accent:#00b8b1; --accent-hover:#00d4cb; --accent-bright:#00e6dc; --on-accent:#05221f; --accent-10/20/35 rgba(0,184,177,.10/.20/.35). Favicon monochrome #e6edf3.
  5. Tokens off-spec: 57 --text2 #7d8590 (should be #8b949e). --text3 used as TEXT at 104, 121, 140, 186, 360, 365, 513, 525-526 (2.3:1, never text). --grey #4b5563 as badge text at 382, 387, 388, 392, 402 (the "STEP ?", "stock ?" badges unreadable). No --text-body; body uses --text (too hot). Fix: --text:#e6edf3; --text-body:#c9d1d9; --text-2:#8b949e; --text-3:#484f58; --overlay:#21262d; body{color:var(--text-body)}; unknown badges: background rgba(139,148,158,.12); color var(--text-2); border 1px dashed var(--border).
  6. White on teal (2.5:1): 242, 518, 533, 544, 2183, 2289. Fix: color var(--on-accent) (#05221f).
  7. No :active compress, zero :focus-visible, outline:none at 96 and 231. Fix: shared block: transitions .15s ease; button:hover background var(--overlay); button:active transform translateY(1px) scale(.97); :focus-visible outline 2px solid var(--accent) offset 2px; .card:active scale(.995).
  8. Card clutter: up to 11 badges in six tints (1136-1149). Collapse to one status pill (Full/Stub/Fetching) + one validation pill + a "4/5 files" meter; stock/price/lifecycle go to the detail panel (gated by show_stock_badges setting). 370 .b 10px radius 3px letter-spacing: use radius 999px, padding 2px 8px, 600, no letter-spacing. 255 .mpn needs Familjen Grotesk 600 15px. Hover-only controls (258-259, 281-283, 404-405 opacity:0) become always visible in --text-2, brighten on hover. 1106-1117 native 28px "– re-fetch…" is broken: icon button opening a styled menu (like .src-popover). 353 .thumb:hover scale(1.06) pops out of the card: border-colour change only. 367-368 + 532-534 .card.active defined twice with infinite pulse + WORKING tag: static 2px accent ring. 270-275/1131-1134 three tile heights: SYM / FP / 3D equal tiles in one 3-col row; .lbr becomes an action-row button. 442 dead CSS.
  9. Tooltip renderer 2424-2465: hardcoded colours (2426), opacity before measure (2443), no vertical clamp/flip, anchored to element not cursor, no caret. 569 title= and 748. Fix: the pickAnchor() renderer from the tooltips skill (cursor-relative, both-axis clamp M=8, measure after display:block, flip), tokens, text-transform:none; ralph-test the widest tooltip at the four corner cards.
  10. Toggles: 2182-2183 / 2288-2289 inline style colour swaps with no aria-pressed; 608 native checkbox (auto-zoom). Fix: .is-on + aria-pressed; auto-zoom becomes a house toggle (role=switch) in settings.
  11. Toast 412-414 + 1757-1765: single div, undefined --border2, innerHTML unescaped, no type/icon/stack/pause/ARIA; alert() at 1670, 1692, 2103, 2104, 2137, 2141 and confirm() at 2378. Fix: cfToast(msg,{type:'success'|'error'|'info', action, ttl}); #toasts fixed bottom-center flex column-reverse gap 8px z var(--z-toast); left 3px accent + SVG icon; hover pauses; errors sticky with X; replace every alert/confirm with toasts (Undo for delete). Consume server _toasts from /api/activity.
  12. No scrollbar styling anywhere (250 .grid, 484 aside, 494 .filelist nested scroller, 506, 651-652, 307, 2163). .modal (237) radius element scrolls. Fix: scrollbars skill global block; one scroller per region; .modal-body max-height 70vh overflow auto inside overflow:hidden radius element.
  13. No phone layout: only media queries 141 and 408. main 249 fixed 1fr 380px; .toolbar wraps to 3-4 rows; .modal min-width 480; .card-btn ~22px tall; 8.5-9px text (456, 281); tooltips disabled on touch with no replacement. Fix: @media (max-width:720px) single column, aside as bottom sheet, modal width calc(100vw - 24px), 44px targets; @media (hover:none) tap on [data-tooltip] opens an info sheet with the text.
  14. ALL CAPS + micro type: text-transform uppercase at 418, 500, 2235-2237, 2252, 2299; literal caps 729/735/739, 533, 1037, 1039, 1085-1094, 1137, 1142, 1054-1056 (KICAD/ALTIUM/FUNSION typo), 2200, 2249, 2257, 2265-2266; 8-9.5px at 365, 2265, 456, 281, 358, 364, 446, 475, 2299. Fix: sentence case (Full, Stub, Fetching, Golden, Divergent, Not validated, KiCad, Altium, Fusion, Complete), 11px floor, weight for emphasis.
  15. Hardcoded hexes: 302, 331-334, 364, 378, 395, 286-292 (12 one-off chip colours), 412, 420/424/491 (undefined --panel2), 427-438, 456, 473, 516, 2157-2163, 2194/2199/2243 (wrong green fallback #34d17e; token is #3fb950), 2278-2281, 2426; 64 --amber #f59e0b (spec --yellow #d29922). z-index literals 100/200/201/210/9999/99999/100001/100050 (toast above tooltip). 65 inline style= blocks (validation 2194-2269, sources 2297-2326). Fix: full token set + --z-toolbar:80 --z-floating-menu:200 --z-toast:400 --z-modal:600 --z-tooltip:99999; classes for validation/sources; one neutral chip style for 3D sources.
  16. AI-drivability: no /state, /console, /ui/toast; polls at 853/855/2184; client-only state (SELECTED 657, DETAIL_TAB 658, project 676, view toggles 2177/2276, SRC_SEL 661, zoom, auto-zoom); no console override. Fix: see docs/dashboard-api-contract.md (server side is being built in parallel).
  17. No settings cog/modal. Credentials overlay 234-248/622-646 at 60% dim; bridge modal 427 blur(4px); architecture overlay 2155 blur(3px). Fix: cog last in .actions; settings modal per settings-layout (560-760px, cards with 3px teal edge, full sentences, toggles, Default hints, Install/Update rows with live console, two-click Restore defaults, 25% dim NO blur, Esc/X/outside close, opens at top).
  18. Header details: 583-584 hardcoded v0.1.2 / 2026-05-03 (inject from /state.version); 587 deprecated wiki host (use https://wiki.adom.inc/adom/adom-chip-fetcher); 582 β€” and nine product names; 121 idle 'β€”'; 95-97 underline on brand hover; 558 vs 580 app name inconsistency (use "Chip Fetcher" as the display name); 125-131 .state-pill 10px caps.
  19. Fonts: 37-51 JetBrains Mono from jsdelivr (use https://adom.inc/fonts/jetbrains-mono/jetbrains-mono-latin-{400,500}-normal.woff2); no Satoshi 700 but 700/800 used at 173, 183, 414, 431, 2194-2257, 2315, 2323; .mpn (255) and aside h2 (497) lack Familjen.
  20. Smaller: 73-74 body flex instead of app-shell position:fixed inset:0 column; 307/1281/1770 duplicated phone detection; 1123 whole .card-desc tooltip duplicates its text; 1762 innerHTML unescaped; 2160/2163 absolute /architecture (use API_BASE); 1669-1670/2378 delete without Undo; 609-613 div tabs with no role/keyboard; 297 pure black backdrop (use rgba(13,17,23,.72)); 2155 + 2426 old palette.