> ## Documentation Index > Fetch the complete documentation index at: https://docs.sesameterminal.com/llms.txt > Use this file to discover all available pages before exploring further. # Phase 1 UX review # Phase 1 UX review Status: 2026-09-30. Reviewer: UI/UX Designer, against `docs/design/**` and PLAN §4, on `lead/phase-1-integration` with the fake venue, at 1440×900 and 390×844 (touch), in both themes. The test browser reported `prefers-reduced-motion: reduce`, so full-motion behaviour was judged from the code. Trade controls are Phase 1 placeholders. Passed: board column geometry; ladder row heights (28/44), centring, depth bars, spread and last-trade rows; stale greying on board, ladder and scores; reduced-motion price markers; static skeletons; board error Retry; palette Esc and Shift+Enter behaviour; `/search` in 7–9 ms; mobile price buttons 76×44; `contrast.mjs` passes. Owner: **P** = FE-Platform, **T** = FE-Trading. | # | Sev | Screen | Problem (spec) | Fix | Owner | | - | - | - | - | - | - | | UX-01 | blocker | Ladder, 1440 | Header wider than its 232 px column: label squeezed to 8 px, close button past the viewport, page scrolls horizontally, pin/close spill into the next slot | `overflow-hidden` on the root, `shrink-0` pin/close, cap outcome segments \~48 px or dropdown, min width on the label | T | | UX-02 | major | Shell/dock, 1440 | Rail is 80 px (`w-20`), so only 3 ladder slots fit (spec: 64 px rail, 4 slots at ≥1280); no active bar | Rail = `--rail-w`; items 64×56, 11 px labels, 2 px `--foreground` active bar | P | | UX-03 | major | Status pill | `text-warning` on `bg-warning/15` (1.58:1 in light; warning is fill-only); disconnected shows `Stale 43s`; geoblocked uses warning not destructive; no `Reconnecting` | Solid fills with `-foreground` text; states and labels per the status-pill table; add `Reconnecting` | P | | UX-04 | major | Mobile header/sheet, 390 | Header 45 px (spec 52); no Cancel All; pill instead of 44 px status dot; theme toggle instead of logo menu; sheet leaves a 7 px strip | Height `--mobile-header-h`; Cancel All slot; status dot; logo menu (Alerts, Settings, Theme, Log out) | P | | UX-05 | major | Event/market view | Split into two pages; event page has no chart or book; outcome click navigates away (spec: select + `replace`) | Three-column event view (outcomes, selected outcome's chart, its ladder) | T | | UX-06 | major | Market/event header, 390 | Title shares a row with the badge and wraps to 6 lines; no back button | Title on its own line (T); back button in the mobile header on detail routes (P) | T, P | | UX-07 | major | Palette | Alt+Enter only toasts "not available yet" | Wire to `useOpenLadder` in `components/trading/ladder` | P | | UX-08 | major | Palette results | Empty query lacks Recent/Held/Live groups; one RESULTS group; no score/clock or bid/ask on the right; event and its moneyline look identical; mobile truncation hides the line | Group by kind; right-side score or bid/ask; kind labels; truncate the shared prefix | P | | UX-09 | major | Motion | `transition-colors` on rail, tab bar, search trigger, Button, Switch; `animate-pulse` skeleton; tooltips zoom and slide | Opacity overlay layers; no pulse; opacity-only tooltips | P | | UX-10 | major | Touch, 390 | Under 44 px: board segments 28, league chips 32, card header 36, chart ranges 32, sheet outcome switch 40, sheet market link 18 (T); status pill 24, theme items 36, tab bar 45 of 56 (P); chip row shows a scrollbar | `pointer-coarse:` sizes or invisible hit areas | T, P | | UX-11 | minor | Palette | Panel uses `--background` not `--popover`; backdrop 70% not 60%; z 50 not `--z-palette`; Tailwind shadow; 48 px rows (spec 40); mobile palette covers the header | Apply tokens; start below the mobile header | P | | UX-12 | minor | Reduced motion | View transitions still call the API; vaul keeps its own 0.5 s transition | Disable view transitions under reduced motion; vaul duration and easing from tokens | P | | UX-13 | minor | Tooltips | 0 ms delay everywhere; inverted colours; stale tooltip lacks its age | 300 ms default, 0 only on trade targets; popover tokens; `Stale 6s` | P | | UX-14 | minor | Focus | Rail/tab-bar links have no focus-visible style; Buttons use a 3 px ring/50 shadow | 2 px `--ring` outline, 1 px offset | P | | UX-15 | minor | Hotkeys | Only Mod+K and `/`; no `?`, `g` chords, F6/Shift+F6, backtick; no panel focus ring | Register the navigation hotkeys | P | | UX-16 | minor | Login | 384 wide, centred at 50%, small title; card moves 18 px on 401; password cleared; 429 has no countdown; no eye button; 36 px controls | Match login.md | P | | UX-17 | minor | Top bar | Wordmark not logo; no venue badge; search trigger colours; disabled Cancel All off-token; SAFE/ARMED placeholder not the 120×32 control | Match app-shell.md | P | | UX-18 | minor | Board | Empty state lacks the next-game line; raw `Failed to fetch`; stale chip text; raw period `1 05:00`; held removals drawn as normal rows | Match live-board.md | T | | UX-19 | minor | Watchlist | No score badge on game markets; subtitle hidden on mobile; no drag handle (no endpoint yet) | Badge and subtitle now; reorder later | T | | UX-20 | minor | Market view | 2 px line, 24 px ranges; no outcome dropdown or tape tabs; chart attribution overlaps the plot; score badge order reversed vs title | Fix sizes, attribution placement (respect the licence), badge order | T | | UX-21 | minor | Ladder | Status line shows `Book live` instead of the score badge; levels unlabelled for screen readers | Score badge; accessible labels | T | | UX-22 | minor | Toasts | Overlap the bottom dock; no 3 px stripe | Offset above the dock; stripe | P | | UX-23 | minor | Bottom dock | 36 px (spec 32) | Set 32 px now | P | | UX-24 | minor | Route change | `keepPreviousData` shows market A while loading B with no cue (risky in Phase 3) | Pending cue; disable price buttons until data matches the route | P | | UX-25 | minor | Errors | Raw `Failed to fetch` in the UI | Map to factual messages | P | | UX-26 | polish | Pin icons | Crossed PinOff shown for "not pinned" | Outline pin = not pinned, filled = pinned | T | | UX-27 | polish | Feel | \~20 s recovery after a backend restart; chip-row scrollbar | Shorter first reconnect delay; hide the scrollbar | P | ## Click budgets (measured) | Task | Budget | Desktop | Mobile | | - | - | - | - | | Buy from board or watchlist | 1 | 1 (placeholder) | 1 (placeholder) | | Open any market | Ctrl+K + typing + Enter | Market hits meet it; event and team hits need +1 click (UX-05) | Meets it | | Cancel all on a market | 1 | 1 (placeholder) | 1 (placeholder) | | Kill everything | 1 | 1 (placeholder, hotkey missing) | **Fails** (UX-04) | | Exit a position / move an order | 1 | Phase 3 | Phase 3 | This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.