fix: Novice badge icon theme token + readable badge hover in all themes (#500)

[RounakKumarAgarwal]

Description

Fixes #500

1. Novice badge icon color (the reported issue)
The Novice badge icon was hardcoded to text-blue-500, so it stayed blue in every theme instead of adapting. Changed to the text-primary theme token (matching the fallback icon, which already uses text-primary). Applied in both Profile.tsx and BadgeUnlocked.tsx.

2. Badge hover contrast (found while verifying)
While testing, I noticed the badge box used hover:bg-accent, which in the High Contrast theme turns the box background pure yellow — making the badge label and icon unreadable on hover. Replaced it with hover:border-primary hover:shadow-md, which highlights the badge on hover without a background swap, so the label and each badge's distinct icon color stay readable in all themes.

Changes

• Profile.tsx: Novice icon → text-primary; badge box hover → hover:border-primary hover:shadow-md.
• BadgeUnlocked.tsx: Novice icon → text-primary.

Testing

• npm run build — no new errors.
• Verified in Light, Dark, and High Contrast: Novice icon adapts to the theme, and badge hover stays readable (no yellow wash-out in HC). Screenshots attached.

Screendrecordings/ScreenShots

-Before Screenshots

-After

BadgeAfter.mp4

[coderabbitai]

Warning

Review limit reached

Next included review available in 15 minutes.

Check out review usage here.

View limit details

Limit details: You’ve used the included review currently available.

You've used all free OSS reviews for now. Wait for the free limit to reset to keep reviewing this public repository.

Learn how review limits work.

Review configuration:

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Advanced

Run ID: 0737f984-96b4-45b7-b3ff-391a1737c3f9

📥 Commits

Reviewing files that changed from the base of the PR and between 9f90f9b and 7e75158.

📒 Files selected for processing (2)

• frontend/src/Pages/Profile.tsx
• frontend/src/components/BadgeUnlocked.tsx

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}