Skip to content

feat: toast notifications, auth fix, accessibility & mobile improvements - #33

Merged
lbowsher merged 1 commit into
mainfrom
lb/ui-tier2-improvements
Mar 22, 2026
Merged

lbowsher merged 1 commit into
mainfrom
lb/ui-tier2-improvements

Conversation

@lbowsher

Copy link
Copy Markdown
Owner

Summary

  • Toast system: Installed sonner and replaced all 10 alert() calls across draft-room, draft-queue, and league-home with toast.success() / toast.error() / toast.warning()
  • Auth security: Replaced deprecated getSession() with getUser() in login page and auth-button-server (validates JWT server-side)
  • Auth button styling: Fixed hardcoded text-gray-400text-muted-foreground so it respects active theme
  • Reduced motion: Added prefers-reduced-motion: reduce CSS media query to disable animations for users who need it
  • Mobile responsiveness: Commissioner controls now wrap on small screens; weekly score columns hidden on mobile (only total shown)
  • Keyboard accessibility: Added skip-to-content link in root layout, focus-visible rings on theme toggle items and Previous Leagues button
  • Loading skeleton: Replaced generic spinner on home page with card-shaped skeleton matching the team list layout

Test plan

  • Trigger a toast: copy a league invite link on the league page — should show bottom-right toast instead of browser alert
  • Verify login still works (getUser change)
  • Check auth button text color adapts across themes (no more hardcoded gray)
  • Enable "Reduce motion" in OS accessibility settings — verify no animations play
  • Resize league page to mobile width — commissioner buttons should wrap, weekly scores should hide
  • Tab through the app — skip-to-content link should appear on first Tab press
  • Navigate to home page with slow connection / loading state — should show skeleton cards

🤖 Generated with Claude Code

…obile improvements

- Replace all alert() calls with sonner toast notifications (success/error/warning)
- Fix getSession() → getUser() security issue in login page and auth button
- Fix hardcoded text-gray-400 → text-muted-foreground in auth button
- Add prefers-reduced-motion CSS media query for accessibility
- Improve mobile responsiveness: commissioner controls wrap, weekly scores hide on small screens
- Add skip-to-content link and focus-visible rings for keyboard navigation
- Upgrade home page loading skeleton with card-shaped placeholders

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>
@lbowsher
lbowsher merged commit bcd2734 into main Mar 22, 2026
4 checks passed
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