Add Dark Mode Support

[mijinummi]

🧠 Concept

Improve dashboard usability across environments.

⚠️ Problem

Many operators work in low-light environments.

📁 Implementation Scope

• apps/web/

✅ Requirements

• Theme toggle
• Preference persistence
• Accessible styling

🎯 Acceptance Criteria

• Dark mode implemented
• Preferences saved
• Accessibility verified

[Fabr-i10]

Proposed Solution
To improve usability in low-light environments, I would implement a dark mode using the existing theming infrastructure already available in the project.
The implementation would include:
• Adding a theme toggle (Light / Dark / System) in the dashboard UI.
• Persisting the selected theme in local storage so the preference remains after page reloads.
• Updating components that use hardcoded colors to rely on shared design tokens and support both themes.
• Verifying accessibility requirements such as color contrast, keyboard navigation, and readability.
Expected Result
• Dark mode available throughout the application.
• User theme preference saved automatically.
• Accessible and consistent experience across all dashboard screens.

[iyanumajekodunmi756]

Hi maintainer, I would love to work on this issue. I have studied the details of the issue description and I understood the requirements. I shall deliver with qualitative feedback and promptly

[grantfox-oss]

🦊 GrantFox — @Fabr-i10 has been assigned to this issue as part of the Official Campaign campaign!

Next steps:

1. Open a Pull Request referencing this issue (e.g., Closes #117)
2. Your PR will be reviewed by the MD-Creative-Production maintainers

Good luck! Track your progress on GrantFox.

[grantfox-oss]

🦊 GrantFox — @iyanumajekodunmi756 has been assigned to this issue as part of the Official Campaign campaign!

Next steps:

1. Open a Pull Request referencing this issue (e.g., Closes #117)
2. Your PR will be reviewed by the MD-Creative-Production maintainers

Good luck! Track your progress on GrantFox.