Skip to content

[Enhancement] Add dark mode supportΒ #9

Description

@niat-web

Feature Request

What:
Add the ability to switch between
light mode and dark mode.

Expected behavior:

  • Toggle button (πŸŒ™/β˜€οΈ) in the top navbar
  • Dark mode: dark background, light text
  • Light mode: current design (default)
  • User preference saved in localStorage
  • On first visit, follows system preference
    (dark if OS is in dark mode)

Why this is important:
Many users prefer dark mode especially
when working at night.
It also reduces eye strain.

Technical implementation:

  • Add CSS variables for colors
  • Toggle class on body element
  • Save preference in localStorage
  • Check system preference on first load

Acceptance Criteria:

  • Dark mode toggle button in navbar
  • All pages look good in dark mode
  • Preference saved across browser sessions
  • Follows system preference on first visit

Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or requestfeature-requestNew feature requestedfrontendrelated to react frontendlow-prioityNice to have but not urgentuiRelated to user interface and design

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions