Feature: Add Light mode & Dark Mode

ngoworldcommunity / NGOWorld

A platform to connect and support NGOs, charities and you to build a better tomorrow.

https://ngoworld.org

MIT License

352 stars 413 forks source link

Feature: Add Light mode & Dark Mode #1201

Closed Surajit0573 closed 4 months ago

Surajit0573 commented 5 months ago

Description

I want to add a toggle button to toggle between light and dark mode.

Proposed Solution

I will create this feature using HTML, CSS, JavaScript, and add the button to navbar.

Screenshots

No response

🥦 Browser

Google Chrome

Checklist ✅

[X] I checked and didn't find similar issue
[X] I have read the Contributing Guidelines
[X] I am participating in JWOC
[ ] I am participating in IWOC
[X] I am willing to work on this issue (blank for no)

github-actions[bot] commented 5 months ago

Hello @Surajit0573, thank you for raising the issue.

Currently, the issue is marked as https://github.com/MilanCommunity/Milan/labels/status%3A%20todo%20%E2%8F%B3 so please wait until the maintainers/owner review it and provide you with feedback/suggestions to proceed further.

Feel free to reach out to Tamal on Twitter, or drop a mail at tamalcodes@gmail.com if you think that this issue is of critical priority.

Give us a ⭐ to show some support Happy OpenSource 🚀

tamalCodes commented 5 months ago

Hi there, we do not use plain HTML, CSS, or JavaScript - We have initially used ReactJS with Bootstrap. And would like to keep it that way. However, there might be multiple issues if we were to add a dark mode right now. Anyways do add a dark mode to one single page, let us see how that works out, and then we can go ahead with the same.

[!IMPORTANT]
Make sure you make the PR to the beta branch, not main

📑 Checklist

Make sure you have joined our organization (important) using this link and also star the repo.
Local project setup, .env for the frontend.
Contributing guidelines to be followed.
Follow proper guidelines.

Pranathi2011 commented 5 months ago

Hi @tamalCodes , I have made PR to the main branch by mistake, what to do now?

riteshshukladev commented 4 months ago

Hey @tamalCodes , would love to add this test feature of Light and dark mode as a test on one of the pages, Kindly assign (if not assigned to some other fellow coder).

tamalCodes commented 4 months ago

Hi @riteshshukladev this was assigned to @Pranathi2011 previously but looks like they are inactive right now - so would be better if you could go ahead and do it. Remember to take a look at other sites for more information on how to add dark mode or what colors can be added for the same.

📑 Checklist in case you missed something

Local project setup, .env for the frontend.
Contributing guidelines to be followed.

Please maintain structure, use conventional pull request titles, and avoid spam to avoid closure or bans.

github-actions[bot] commented 3 months ago

Hi @tamalCodes, We just made a new organization, and have sent you an invite. Welcome to the community 🎉

Don't forget after accepting to make it public so it appears on your GitHub profile for everyone else to see. You can do this by finding your name in the GitHub organisation list and change the dropdown to public https://github.com/orgs/MilanCommunity/people