Skip to content

fix(webapp): hide review progress orb on mobile#28

Open
specbug wants to merge 1 commit into
mainfrom
phone-opt
Open

fix(webapp): hide review progress orb on mobile#28
specbug wants to merge 1 commit into
mainfrom
phone-opt

Conversation

@specbug
Copy link
Copy Markdown
Owner

@specbug specbug commented May 24, 2026

Summary

  • On phones, the absolutely-positioned starburst progress orb on ReviewScreen overlapped the centered prompt text.
  • Added a review-progress-orb class on the orb wrapper and a @media (max-width: 720px) { display: none } rule in base.css. The session counter in the header (SESSION · 01 / 04) still communicates progress.
  • Scope intentionally narrow — no other mobile changes; review is the only window we want usable on phones.

Test plan

  • bun run start — webpack compiled, only the pre-existing PdfScreen eslint warning remains.
  • DevTools device toolbar @ iPhone width: orb is gone, prompt sits centered without the starburst behind it.
  • Desktop ≥720px: orb still renders on the left at left: 48px as before.
  • Seeded 5 dummy cards via /annotations + /study-cards and walked the Review queue locally.

Co-Authored-By: Claude noreply@anthropic.com

The absolutely-positioned starburst on the Review screen overlapped the
centered prompt on narrow viewports. Hide it ≤720px — the session
counter in the header still communicates progress.

Co-Authored-By: Claude <noreply@anthropic.com>
@specbug specbug added the claude PR created by Claude label May 24, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

claude PR created by Claude

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant