Skip to content

[Enhancement] Add Dark Mode and Light Mode Theme Toggle #245

@Mousam25Aarya

Description

@Mousam25Aarya

Currently, OpenCSE only provides a single visual theme. Users studying for long hours, especially during nighttime, may experience eye strain due to the lack of a dark mode option.

Proposed Solution

Implement a theme toggle that allows users to switch between Light Mode and Dark Mode according to their preference.

Features to Include

  • Light Mode (default theme)
  • Dark Mode for comfortable reading in low-light environments
  • Theme toggle button in the navigation bar/header
  • Store user preference using local storage so the selected theme persists across sessions

Benefits

  • Improved accessibility and user experience
  • Reduced eye strain during extended study sessions
  • Modern and visually appealing interface
  • Better usability for students studying at night

Expected Outcome

Users should be able to seamlessly switch between Light and Dark themes, and their preference should remain saved even after refreshing or reopening the website.

Additional Notes

The implementation can be done using CSS variables, theme classes, and JavaScript local storage.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions