Skip to content

Enable a focused desktop dashboard on landscape iPads - #57

Merged
avatarneil merged 2 commits into
mainfrom
t3code/enable-ipad-desktop-layout
Sep 20, 2026
Merged

avatarneil merged 2 commits into
mainfrom
t3code/enable-ipad-desktop-layout

Conversation

@avatarneil

@avatarneil avatarneil commented Sep 20, 2026 •

Copy link
Copy Markdown
Owner

The 11-inch iPad Pro now gets the desktop schedule sidebar and inline game details in landscape. The dashboard activates at 1,152px (72rem), covering both 1,194px and 1,210px landscape widths; portrait retains the single-column layout.

Selecting a game collapses the redundant right-hand overview and brings its details to the top. The sidebar centers the matching game, marks it as “Viewing details,” and preserves usable keyboard focus when the selected card hides. Closing details restores the overview. Games can be switched directly from the sidebar, and live refreshes leave manual scrolling alone. Rotating into landscape also reveals the selected sidebar game.

The CSS layout and JavaScript dialog selection share the same breakpoint. Regression tests cover breakpoint boundaries, independent scrolling, sticky layout, control fit, close behavior, selection through rotation, collapse/reopen, keyboard focus, and game switching. The existing dialog-sizing test uses portrait and waits for the entrance animation before measuring.

Validation:

  • Production build, TypeScript, changed-file formatting, and lint pass (seven existing lint warnings elsewhere).
  • 45 final responsive and close-control checks pass across Chromium, Firefox, and mobile Safari/WebKit, including the new collapse, sidebar selection, rotation, and keyboard scenarios.
  • Game switching, late-response protection, live refresh, schedule navigation, accessibility, and desktop wheel-scrolling checks also pass.
  • Inspected iPad-emulated WebKit screenshots at 1,194×834, 1,210×834, and 834×1,194, plus phone, laptop, and ultrawide layouts; no page horizontal overflow.
  • The two existing mouse-wheel tests run on Chromium and Firefox because mobile WebKit does not support mouse-wheel emulation.

@vercel

vercel Bot commented Sep 20, 2026 •

Copy link
Copy Markdown
Contributor

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated
nfl-playoff-bracket Ready Ready Preview Sep 20, 2026 6:44pm UTC

Request Review

@avatarneil avatarneil changed the title t3code/enable ipad desktop layout Enable desktop dashboard on landscape 11-inch iPad Pro Sep 20, 2026
@avatarneil avatarneil changed the title Enable desktop dashboard on landscape 11-inch iPad Pro Enable a focused desktop dashboard on landscape iPads Sep 20, 2026
@avatarneil
avatarneil merged commit ea44cc8 into main Sep 20, 2026
10 checks passed
@avatarneil
avatarneil deleted the t3code/enable-ipad-desktop-layout branch September 20, 2026 18:47

This branch was successfully deployed

1 active deployment
Preview — 3aa470a0 Deployed Sep 20, 2026 by vercel[bot]
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant