Added customizable appearance and theme system

[pracheyyy]

Added Customizable Appearance & Theme System

closing issue #170

📌 Changes Made

• Added a Theme customization system for the dashboard
• Added a ThemeContext using React Context API
• Added a new Theme button in the top navigation
• Implemented a Discord-inspired theme palette popup
• Added multiple selectable color themes
• Added persistent theme saving using localStorage
• Improved overall UI/UX with smoother theme switching

🎨 Available Themes

• Light
• Dark
• Pastel Green
• Peach
• Pastel Blue
• Purple Dark
• Red Dark
• Brown Dark
• Grey Blue

Files Modified

• src/components/dashboard/Dashboard.jsx
• src/components/friends/header/TopnavDashboard.jsx
• src/index.css
• src/main.jsx

New Files Added

• src/context/ThemeContext.jsx

✅ Additional Notes

• Responsive UI maintained
• Existing functionality preserved
• .env files were not committed
• Lint checks passed successfully

📷 Screenshots

WhatsApp.Video.2026-05-25.at.3.37.09.PM.mp4

[vercel]

@pracheyyy is attempting to deploy a commit to the Sunil Kumar's projects Team on Vercel.

A member of the Team first needs to authorize it.

[pracheyyy]

Hello @0rigin-c0de

I have completed the assigned issue under GSSoC'26: Add customizable appearance/theme option.
I have also attached screenshots/demo for review.

Please review my PR. Thank you! 🚀

[0rigin-c0de]

@pracheyyy Can we only use dark ones
because light ones making application dull
or can you customise light ones to look more sharper

[pracheyyy]

@0rigin-c0de
Alright, then I’ll keep only the dark themes for now to maintain a cleaner and more modern UI consistency across the application.

[pracheyyy]

hi @0rigin-c0de,
I have replaced the previous color palette with a more refined dark-themed palette to improve the overall visual consistency and modern appearance of the application.

Hope the requirements are satisfied now. Please review the updated changes.

[pracheyyy]

Hello @0rigin-c0de
i did changes in color pallet as you said!
Please review my PR. Thank you! 🚀

[pracheyyy]

@0rigin-c0de
/i reverted , plese check once

[0rigin-c0de]

@pracheyyy Thanks for you contribution
Merging this PR

[pracheyyy]

@0rigin-c0de
thank you for revieving and merging my PR.
looking forward for more contributions!