UI BUG: Header Layout Feels Cluttered and Needs Better Hierarchy

### Is there an existing issue for this?

- [x] I have searched the existing issues

### What happened?

## 📌 Description

The current header layout feels visually cluttered and lacks a clear UI hierarchy. Key actions are placed in positions that reduce usability and make the header look messy rather than intentional.

This affects first impressions and overall navigation clarity.

## 🔍 Problems Identified

1.Theme Toggle Button

i. Currently placed in the center, which breaks standard UI conventions.
ii. Theme toggles are typically secondary actions and should not occupy central focus.

2. Search Button Placement

i. The search button appears after the theme toggle.
ii. From a UX standpoint, search is a primary action and should be more accessible.

3. GitHub Redirect Button

i. The GitHub redirect button is visually detached from the GitHub logo.
ii. This reduces discoverability and feels inconsistent.

## ✅ Proposed Improvements

i. Move the theme toggle button to the corner (top-right preferred).

ii. Place the search button before the theme toggle, giving it higher priority.

iii. Position the GitHub redirect button next to the GitHub logo to create a clear visual association.

## 🎯 Expected Outcome

i. Cleaner and more professional-looking header

ii. Better visual hierarchy and usability

iii. Improved alignment with common UI/UX best practices

## 📸 ScreenShots

### Record

- [x] I agree to follow this project's Code of Conduct