Added Dark Mode Toggle

[SamyukthaaAnand]

Overview

This PR introduces a Dark Mode feature across the TechMyrmidons website with a sun/moon toggle in the navbar.

Changes Made

• Implemented ThemeToggle component with sun/moon icons.
• Added theme.css with CSS variables for light and dark themes.
• Integrated toggle into Navbar.jsx next to the hamburger menu.
• Updated index.html to prevent flash of incorrect theme on page load.
• Replaced hardcoded colors in CSS files with theme variables (--bg, --text, --card, --elev, --link).
• Ensured navbar links, buttons, cards, and sections adapt to the active theme.

Result

• Users can switch between light and dark mode.
• Theme preference persists across sessions.
• All major UI elements (backgrounds, text, buttons, nav links) adapt properly.

Screenshots

Light Mode

Dark Mode

Notes

• Future improvement: extend theme variables to any remaining components that still use fixed colors.

[alvin-dennis]

@SamyukthaaAnand Pls share the public access hosted link of you forked repo

[SamyukthaaAnand]

@SamyukthaaAnand Pls share the public access hosted link of you forked repo

https://techmyrmidons-web-ten.vercel.app

[alvin-dennis]

@SamyukthaaAnand Make sure the dark mode is applied to everything. not just the home page

[SamyukthaaAnand]

@SamyukthaaAnand Make sure the dark mode is applied to everything. not just the home page

Thanks for pointing that out! I’ve updated the styles so dark mode now applies across all pages. You can verify with the deployed link.

[alvin-dennis]

@SamyukthaaAnand pls make sure modes are applied to everything
For example year button is still black in dark mode