📌 Problem Description
EduBridge is currently locked to a single light/default theme. Coding students frequently prefer a dark-themed UI to reduce eye strain during long learning sessions.
✨ Proposed Solution
Add a universal theme toggle switch in the main navigation bar.
- Use CSS custom properties/variables (
--bg-color, --text-color) globally across all stylesheet elements.
- Use JavaScript to add/remove a
.dark-theme class on the <body> tag.
- Save the user’s choice in
localStorage so the theme persists when navigating between pages (index.html, login.html, quiz.html, etc.).
📂 Proposed Code Changes
- All
.html files: Add the toggle switch widget in the header navigation element.
styles/: Refactor colors to utilize modern CSS variables.
scripts/: Create a global helper script to handle state reading/writing on page load.
🏷️ Target Labels
📌 Problem Description
EduBridge is currently locked to a single light/default theme. Coding students frequently prefer a dark-themed UI to reduce eye strain during long learning sessions.
✨ Proposed Solution
Add a universal theme toggle switch in the main navigation bar.
--bg-color,--text-color) globally across all stylesheet elements..dark-themeclass on the<body>tag.localStorageso the theme persists when navigating between pages (index.html,login.html,quiz.html, etc.).📂 Proposed Code Changes
.htmlfiles: Add the toggle switch widget in the header navigation element.styles/: Refactor colors to utilize modern CSS variables.scripts/: Create a global helper script to handle state reading/writing on page load.🏷️ Target Labels
featureeasy