Dark Mode Feature in Coding Sheets Page | HacktoberFest 2023

[NayakPenguin]

Hey there! This issue is tailor-made for newcomers who are just getting started with their contributions and have some development skills under their belt. We're here to welcome and support you on your journey! 🚀

Since we didn't plan from the start that we would go for the dark mode, it's hard now to get the whole project in dark mode. Hence we are going one by one, one page after another. This would be the first!

Tasks :

0. Your task involves working on the file located at client > src > Screen > CodingSheets.js.
1. Generate a global CSS file named "dark mode colors."
2. In the above global CSS file, establish color variables that can be adjusted later, such as --dark-color-1: rgba(0,0,0,.5).
3. Create a button, as described, within the "cc-header" file.
4. Implement a function where toggling the button results in a switch to dark mode on the page.
5. Additionally, save this preference in local storage so that if a user previously used dark mode, it will be retained for their next visit.

How to run the repo locally :

Check #104

Important :

1. Please don't change any file other than what is mentioned - if you want please mention it below.

How to get your PR accepted :

1. Consider giving our project a star as it helps enhance the project's credibility.
2. Write the PR title as - # 109 Issue Resolved | {something you want to mention}
3. Write a good PR comment with a screen-shot of the work
4. Make sure to generate the PR to the main branch of this repository.

Express your interest in the open-conversion section below to request this issue as an assignee! Enjoy your coding journey! :) 🚀

[sdroyc]

Hi! I would love to work on this issue!

[NayakPenguin]

Amazing to see your interest :) Sure, I am assigning this task to you @soumyadeeproychowdhury!
Happy coding 🚀

[sdroyc]

Thank you will be giving time to time updates! @Nayaker

[NayakPenguin]

@soumyadeeproychowdhury any update buddy?!

[sdroyc]

@Nayaker gimme one more day I will get it done ! I reviewed what all I had to do I was learning few things I didn't know once I do that I will be right on it.Will get it done in 2days max!

[riyanrathore26]

Hi @Nayaker please assigne me this issue I would love to work on this issue!

[NayakPenguin]

Sure @riyanrathore26, but I want you to know a few changes that are required. Are you up for a google meet right now?

[riyanrathore26]

yes i am ready for google meet please share link also you can tell me here what changes you want to implement

[NayakPenguin]

Can you share me your email/discord/WhatsApp

[riyanrathore26]

WhatsApp. +916378948871

[thakurthegr8]

is this issue still available? @Nayaker

[NayakPenguin]

@thakurthegr8, we appreciate your interest, but we regret to inform you that the dark mode features are being discontinued.

[thakurthegr8]

Oh i tried to add some code it worked app wide @Nayaker Here's the result: https://github.com/Nayaker/AlgoListed/assets/68949544/bdf1e2bf-344c-4c02-b7ac-84dbc69b2cd9

[NayakPenguin]

Amazing @thakurthegr8, I have talked with your friend Anuj - We will do a google meet tomorrow!

[thakurthegr8]

Sure @Nayaker