Address PR #7 review feedback: accessibility, CSS cleanup, and functionality fixes

[Copilot]

Addresses 11 review comments from PR #7 covering accessibility gaps, broken functionality, CSS conflicts, and incomplete branding changes.

Accessibility

• Add aria-label to TopicChip buttons (Search for ${topic.label} videos)
• Add motion-reduce classes throughout for prefers-reduced-motion support

Functionality

• Fix SuggestedPrompts: open YouTube search in new tab instead of setting videoUrl state (which breaks video processing)
• Clarify video preview card is decorative: add "Example Preview" label, remove cursor-pointer
• Fix navigation Link group-hover: add inline-flex items-center gap-2 for proper arrow translation

CSS

• Rename duplicate shimmer keyframe to skeleton-shimmer (conflicted with existing animation at line 208)
• Remove unused classes: .input-glow, .chip, .text-shadow-lg, .text-shadow-glow, .animate-shimmer
• Add hover:bg-[position:100%_0] to Button danger/success variants (matches primary variant gradient shift)

Branding

• Revert incomplete "Video2Learn" rebrand to "UVAI.io" (dashboard, playground, metadata all still use UVAI.io)

Before:

<button onClick={() => onSelect?.(topic.query)}>
  {topic.label}
</button>

// Sets state to search results URL
setVideoUrl(`https://www.youtube.com/results?search_query=...`);

After:

<button 
  onClick={() => onSelect?.(topic.query)}
  aria-label={`Search for ${topic.label} videos`}
  className="motion-reduce:transition-none"
>
  {topic.label}
</button>

// Opens search in new tab
window.open(searchUrl, '_blank', 'noopener,noreferrer');

---

💬 We'd love your input! Share your thoughts on Copilot coding agent in our 2 minute survey.

[vercel]

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

Project	Deployment	Actions	Updated (UTC)
event-relay-web	Error		Feb 5, 2026 5:56am
v0-uvai	Error		Feb 5, 2026 5:56am

[Copilot]

Pull request overview

This pull request addresses review feedback from PR #7 by implementing accessibility improvements, fixing functionality issues, cleaning up CSS, and reverting incomplete branding changes.

Changes:

• Added accessibility features including aria-label attributes and comprehensive motion-reduce support for users with motion sensitivity preferences
• Fixed SuggestedPrompts functionality to open YouTube searches in new tabs instead of breaking video processing by setting invalid URLs
• Cleaned up CSS by removing unused classes and resolving duplicate animation keyframe naming conflicts
• Reverted incomplete "Video2Learn" rebrand back to "UVAI.io" for consistency across the application

Reviewed changes

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

File	Description
apps/web/src/components/ui/SuggestedPrompts.tsx	Added aria-label to topic chips and implemented motion-reduce classes for accessibility; added style prop forwarding
apps/web/src/components/ui/Button.tsx	Added gradient position shift on hover to danger and success button variants for consistency with primary variant
apps/web/src/app/page.tsx	Fixed SuggestedPrompts to open YouTube search in new tab; clarified video preview as decorative example; reverted branding from "Video2Learn" to "UVAI.io"; improved navigation link hover behavior
apps/web/src/app/globals.css	Renamed duplicate shimmer keyframe to skeleton-shimmer to resolve conflict; removed unused CSS classes (.input-glow, .chip, .text-shadow-lg, .text-shadow-glow, .animate-shimmer)

[sentry]

Bug: An inline style opacity: 0 overrides the motion-reduce:opacity-100 class, making the component invisible for users with reduced motion enabled.
_{Severity: HIGH}

Suggested Fix

Remove the opacity: 0 from the inline style object. The initial state should be managed by the animation keyframes (animate-fade-in-up) to ensure it does not conflict with the motion-reduce utility classes. This allows the motion-reduce:opacity-100 class to correctly apply when needed.

Prompt for AI Agent

Review the code at the location below. A potential bug has been identified by an AI
agent.
Verify if this is a real issue. If it is, propose a fix; if not, explain why it's not
valid.

Location: apps/web/src/components/ui/SuggestedPrompts.tsx#L111-L127

Potential issue: The component sets an inline style `opacity: 0`, which has higher CSS
specificity than the `motion-reduce:opacity-100` utility class. For users with the
`prefers-reduced-motion` accessibility setting enabled, animations are correctly
disabled, but the element remains invisible because the inline style takes precedence.
This makes the `SuggestedPrompts` container and its child `TopicChip` components
unusable for this group of users, which is a significant accessibility issue.

_{Did we get this right? 👍 / 👎 to inform future reviews.}