Skip to content

Polish mobile scoring cards and nav#261

Merged
mwickett merged 2 commits into
mainfrom
mwickett/mobile-polish-219-220
Jun 13, 2026
Merged

Polish mobile scoring cards and nav#261
mwickett merged 2 commits into
mainfrom
mwickett/mobile-polish-219-220

Conversation

@mwickett

Copy link
Copy Markdown
Owner

Summary

  • Bump mobile typography inside Hot & Cold and Win Probability scoring cards while keeping desktop compact.
  • Tighten the mobile header flex layout so long organization names have a bounded shrink/truncation area instead of forcing horizontal overflow.

Fixes #219
Fixes #220

Validation

  • npm run typecheck
  • npm run lint (passes with pre-existing .claude/worktrees warnings)
  • npm test -- --runTestsByPath src/components/tests/scoring/BetweenRoundsView.test.tsx src/components/tests/scoring/GameOverView.test.tsx src/components/tests/scoring/ScoreEntryView.test.tsx src/components/tests/scoring/utils.test.ts
  • npm test -- --testPathIgnorePatterns='\.claude/'

Notes

  • Local npm run build is blocked by the placeholder Postgres DATABASE_URL during prisma migrate deploy.
  • Local Playwright smoke test is blocked by an invalid local Clerk secret key before the app renders.

@vercel

vercel Bot commented Jun 13, 2026

Copy link
Copy Markdown

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

Project Deployment Actions Updated (UTC)
blitzer Ready Ready Preview, Comment Jun 13, 2026 5:05pm

Copilot AI left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR focuses on mobile UI polish in scoring graphs and the global header, improving readability on small screens while keeping desktop layouts compact and preventing horizontal overflow in the nav.

Changes:

  • Increased mobile typography sizes inside Win Probability and Hot & Cold scoring cards (with md: breakpoints to preserve desktop density).
  • Adjusted grid/header alignment and spacing in the Hot & Cold card to match the player label column.
  • Tightened the mobile header flex layout in NavBar to better constrain/shrink long organization names and reduce horizontal overflow.

Reviewed changes

Copilot reviewed 3 out of 3 changed files in this pull request and generated 1 comment.

File Description
src/components/scoring/graphs/WinProbabilityCard.tsx Bumps internal label/value typography on mobile and improves layout wrapping for “Projected finish”.
src/components/scoring/graphs/HotColdCard.tsx Increases mobile grid text sizes and reworks round header alignment to match the player label column.
src/app/NavBar.tsx Updates header flex sizing/gaps and constrains the org switcher region to reduce mobile overflow.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Comment thread src/app/NavBar.tsx
<div className="ml-auto flex min-w-0 flex-1 items-center justify-end gap-2 md:gap-2 lg:gap-4">
<Show when="signed-in">
<div className="max-w-[200px] overflow-hidden md:max-w-none">
<div className="min-w-0 max-w-[120px] flex-shrink overflow-hidden sm:max-w-[180px] md:max-w-[220px] lg:max-w-none">
@mwickett
mwickett marked this pull request as ready for review June 13, 2026 17:06
Copilot AI review requested due to automatic review settings June 13, 2026 17:06
@mwickett
mwickett merged commit 896bd53 into main Jun 13, 2026
3 checks passed
@mwickett
mwickett deleted the mwickett/mobile-polish-219-220 branch June 13, 2026 17:06

Copilot AI left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Copilot reviewed 4 out of 4 changed files in this pull request and generated 1 comment.

Comment thread src/app/page.tsx
Comment on lines +43 to 49
<Link href="/games/new">
<Button
size="lg"
className="font-semibold px-8 py-6 text-lg bg-brandAccent hover:bg-brandAccent/90"
>
Go to Dashboard <ArrowRight className="ml-2 h-5 w-5" />
Start New Game <ArrowRight className="ml-2 h-5 w-5" />
</Button>
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.

Main nav has horizontal overflow on mobile Plan 6.1: Bump HotCold/WinProbability internal grid text on mobile

2 participants