Feature Request: Add Dark/Light Mode Toggle on Finance Tips Page #1029
Description
Feature Request: Add Dark/Light Mode Toggle on Finance Tips Page
Description
Currently, the Finance Tips page only supports a single theme. Adding a Dark/Light Mode toggle would improve accessibility and enhance the user experience, especially for users browsing at night.
This feature will allow users to switch between light and dark themes and store their preference for future visits.
🚀 Proposed Solution
Implement a theme toggle button on the Finance Tips page that:
Allows switching between Dark Mode and Light Mode
Saves the selected theme using localStorage
Automatically loads the saved theme when the page is refreshed
🧩 Suggested Implementation
- Add a toggle button in the navbar/header
Example:
🌙
- Add dark theme styles
Use a class like .dark-mode applied to the element.
Example:
.dark-mode {
background: #0f172a;
color: #e5e7eb;
}
- Add JavaScript logic
Toggle the .dark-mode class
Store theme preference in localStorage
🎯 Expected Benefits
Improved readability in low-light environments
Better user accessibility
Consistent UI with other pages that support theme switching
Enhanced modern user experience
📌 Additional Notes
Ensure the toggle does not break the existing CSS styling.
Maintain consistency with the theme toggle used across other pages if already implemented.
✅ Task Checklist
Add toggle button to Finance Tips page
Implement dark mode CSS styles
Add JavaScript for theme switching
Save theme preference in localStorage
Test responsiveness and UI consistency