Skip to content

fix: improve navigation button UI on contributor profile and badges pages - #786

Closed
zaibamachhaliya wants to merge 1 commit into
ohcnetwork:mainfrom
zaibamachhaliya:fix/navigation-button-ui
Closed

zaibamachhaliya wants to merge 1 commit into
ohcnetwork:mainfrom
zaibamachhaliya:fix/navigation-button-ui

Conversation

@zaibamachhaliya

Copy link
Copy Markdown

Closes #784

Summary

Improved the navigation button UI on both the Contributor Profile and Badges pages. Previously they were plain text links, now they use the project's Button component with a clear arrow icon.

Changes

  • Contributor Profile (app/[username]/page.tsx): ← Back to Leaderboard → Button component with ArrowLeft icon
  • Badges Page (app/badges/page.tsx): ← Back to Home → Button component with ArrowLeft icon

Improvements

  • Consistent button style across both pages
  • Uses existing project's Button component and design system
  • Left-arrow icon (lucide-react)
  • Proper padding, spacing, and alignment
  • Visible hover and focus states
  • Keyboard accessible (Tab + Enter work)
  • Responsive on mobile and desktop
  • Removed default link underline
  • Preserved existing navigation destinations (/leaderboard and /)
  • No changes to existing functionality

Screenshots

Contributor Profile - Before & After

Before
image

After
image

Badges Page - Before & After

Before
image

After
image

@rithviknishad

rithviknishad commented Sep 22, 2026 •

Copy link
Copy Markdown
Member

buttons for actions, links for navigates.

https://developer.mozilla.org/en-US/docs/Learn_web_development/Core/Accessibility/HTML

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.

Improve navigation button UI on Contributor Profile and Badges pages

2 participants