toggle dark mode and light mode

[gurramkarthiknetha]

Is your feature request related to a problem? Please describe.
Currently, the website only uses a single theme (light or dark), which can be uncomfortable for users who prefer one theme over the other. Users may need to adjust their environment settings for better accessibility and usability.

Describe the solution you'd like
I would like to add a toggle button to the website that allows users to switch between dark mode and light mode according to their preferences. This toggle should be easy to access, ideally placed in the website's header or settings menu.

Describe alternatives you've considered
An alternative solution could be automatically detecting the user's preferred theme based on their device settings (light or dark mode). However, giving users the option to manually switch between themes ensures greater customization and user satisfaction.

Approach to be followed

Implement a theme switcher button on the website’s UI.
Store the user’s theme preference in local storage or cookies to maintain the choice across sessions.
Apply CSS media queries to detect the default system theme while allowing manual override by the user.
Test accessibility for both themes to ensure readability and usability for all users.
Additional context
Adding dark mode and light mode options is a widely requested feature across websites for accessibility and user comfort, especially for users who prefer a dark interface to reduce eye strain.

[github-actions]

Congratulations on making your first Issue! 🎊 If you haven't already, check out our Contributing Guidelines and Issue Reporting Guidelines to ensure that you are following our guidelines for contributing and making issues.

[gurramkarthiknetha]

i want to work on this issue.
could you please assign this issue to me

[palisadoes]

We are now focusing on three types of issues as priority areas:

1. The improvement in the reliability of our code base. There are many issues created to test existing code. It is a good place to start if you want to understand the operation of various apps. When you submit PRs, we automatically check to see whether the code you submitted has been covered by testing and that each file meets the minimum standard level of the repository as a whole. You won’t be able to avoid understanding testing regimes to contribute to Talawa.
2. The fixing of bugs and features that seriously hamper the user from using the application. The apps have various shortcomings. The most obvious ones are where the apps do not work as expected. For example buttons that don’t work, errors or messages that are not displayed to make the user understand what to do and many more. Think of any difficulty you have had in getting things working, there could be a bug there waiting for you.
3. Coding of screens for issues created by our Contributor team based on our soon to be updated design guide. This may include updates to existing screens.
4. The creation of additional or updated documentation that helps with improving both the experience of the end user and the various GitHub contributors who support the development of our software. This would include user guides.

We will only be accepting feature issues for deficiencies that are obviously lacking in the apps. These are things that make it very difficult to operate the apps. Even so, the PRs will still require you to understand testing as stated before.

Cosmetic changes that require only a few lines of code, or relate to screen sizes unlikely to be used are not acceptable under this policy.

Closing

[palisadoes]

1. There is a project by @AVtheking to create a global CSS file and updating the design to assist the color blind.
2. These are higher priorities.