Skip to content

Feature/sponsor rewards a11y fix#24

Merged
BeeXD merged 2 commits into
mainfrom
feature/sponsor-rewards-a11y-fix
Jun 23, 2026
Merged

Feature/sponsor rewards a11y fix#24
BeeXD merged 2 commits into
mainfrom
feature/sponsor-rewards-a11y-fix

Conversation

@BeeXD

@BeeXD BeeXD commented Jun 23, 2026

Copy link
Copy Markdown
Collaborator

No description provided.

Copilot AI review requested due to automatic review settings June 23, 2026 17:55
@vercel

vercel Bot commented Jun 23, 2026

Copy link
Copy Markdown

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

Project Deployment Actions Updated (UTC)
dev3-0 Ready Ready Preview, Comment Jun 23, 2026 5:55pm

@BeeXD BeeXD merged commit ff019c8 into main Jun 23, 2026
2 checks passed

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

Improves the sponsor rewards “flip card” UI with better semantics and motion-reduction handling, and ensures navbar scroll-driven UI state is synchronized correctly on initial render.

Changes:

  • Adds keyboard-accessible flip interaction and updates reward descriptions to support richer markup (lists) in SponsorRewards.
  • Adds prefers-reduced-motion styling for the flip interaction.
  • Initializes scroll-derived UI state immediately in App/Navbar effects to avoid a stale first render.

Reviewed changes

Copilot reviewed 2 out of 2 changed files in this pull request and generated 2 comments.

File Description
src/components/SponsorRewards.tsx Adds accessible flip interactions, richer reward description content, and reduced-motion styling (with a couple of state/ARIA consistency issues to address).
src/App.tsx Syncs scroll-based navbar/ticker state immediately on mount to prevent incorrect initial UI.

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

Comment on lines +13 to +20
const [isMobileView, setIsMobileView] = useState(false);

useEffect(() => {
const checkMobile = () => setIsMobileView(window.innerWidth < 768);
checkMobile();
window.addEventListener('resize', checkMobile);
return () => window.removeEventListener('resize', checkMobile);
}, []);
Comment on lines +242 to +250
@media (prefers-reduced-motion: reduce) {
.flip-card {
transition: none;
}
.flip-hint-icon {
animation: none;
}
}

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.

2 participants