[BUG] Navbar active state and visual consistency issues across dashboard pages

[Sammmyyyyyyy]

Description

There are a couple of navigation bar inconsistencies across the dashboard pages.

Current Behavior

1. The active navigation item is not updated correctly when navigating between pages.

   • Overview remains highlighted even after moving to Resume or Leaderboard.
   • The active state does not always reflect the current route.

2. The navbar backdrop styling is inconsistent on the Overview page.

   • On Resume and Leaderboard pages, the navbar uses the blurred/glass (backdrop blur) effect from the top of the page.
   • On the Overview page, the navbar initially shows a solid blue background and only switches to the blurred/glass effect after scrolling.
   • This creates an inconsistent visual experience between pages.

Expected Behavior

• The active navigation item should always match the current page.

  • Overview → Overview highlighted
  • Resume → Resume highlighted
  • Leaderboard → Leaderboard highlighted

• The navbar should have consistent styling across all dashboard pages.

  • The blurred/glass effect should be applied on the Overview page from the initial page load, matching the behavior of Resume and Leaderboard.

Steps to Reproduce

1. Open the Overview page.
2. Observe the navbar background style.
3. Navigate to Resume or Leaderboard.
4. Notice that the navbar appearance differs.
5. Observe that the active tab highlight may remain on Overview instead of updating to the current page.

Suggested Fix

• Use route-based pathname detection for determining the active navigation item.
• Standardize navbar styling across dashboard pages so the same backdrop blur/glass effect is applied consistently from initial render.

Aditional Note

I would like to work on the issue by myself under GSSOC'26
My implementation plan -

• Fix the navigation active-state logic so the highlighted tab always matches the current route
• Replace any static active-tab behavior with pathname-based route detection
• Investigate the navbar styling differences between Overview, Resume, and Leaderboard pages
• Standardize the navbar backdrop/glass effect across all dashboard pages for a consistent visual experience
• Verify correct behavior during navigation, page refreshes, and scrolling

[Sammmyyyyyyy]

Hi @Priyanshu-byte-coder,

I'd like to take this up under GSSoC'26.

Implementation plan:

• Fix the navigation active-state logic so the highlighted tab always matches the current route
• Replace any static active-tab behavior with pathname-based route detection
• Investigate the navbar styling differences between Overview, Resume, and Leaderboard pages
• Standardize the navbar backdrop/glass effect across all dashboard pages for a consistent visual experience
• Verify correct behavior during navigation, page refreshes, and scrolling
  Looking forward to working on it.

[Sammmyyyyyyy]

/assign me under gssoc'26.

[github-actions]

Assigned to @Sammmyyyyyyy! You have 7 days to open a PR. No PR after 7 days = auto-unassigned so others can pick it up. Good luck!