[FEATURE] <description> Implement Dark/Light Theme Toggle with a Tobler Button

[kekubhai]

Is this a unique feature?

• [X] I have checked "open" AND "closed" issues and this is not a duplicate

Is your feature request related to a problem/unavailable functionality? Please describe.

Enhance user experience by adding a convenient theme toggle button at the top of the depot interface. This button will allow users to seamlessly switch between a dark and light theme, catering to their visual preferences and potentially improving readability and comfort in different lighting conditions.

Proposed Solution

Create a visually appealing tobler button design that clearly indicates the current theme (e.g., a sun icon for light theme, a moon icon for dark theme). Ensure the button is easily accessible and stands out from the rest of the interface.

Screenshots

Do you want to work on this issue?

Yes

If "yes" to above, please explain how you would technically implement this (issue will not be assigned if this is skipped)

Create a React component:

Define a component called ThemeToggle. Use state to store the current theme (e.g., theme as a string). Implement a function to handle button clicks and update the theme state. Render the button:

Use conditional rendering to display different content or styles based on the theme state. For example, you could display different icons or colors for the light and dark themes. Define styles:

Use CSS or styled components to define the styles for each theme. For example, you could set different background colors, font colors, and other properties for the light and dark themes.

[lakshmirajvagu]

I would like to work on it @Jaishree2310

[kekubhai]

Hey @Jaishree2310 , I am gettiing caught up with something really important. I will not be able to work on this issue, Please un-assign me and Assign @lakshmirajvagu on this Task. Sorry for the inconvinience . Will try my earnest to work on later issues. Thank You

[tobiasrahul]

@Jaishree2310 Hey Please assign this to me as I have a good experience in web development as I worked as an intern at Metacrafters. The Person who was Previsouly assigned is asking to remove him so please now assign me

[lakshmirajvagu]

@tobiasrahul it's first come first assign method

[tobiasrahul]

@lakshmirajvagu Actually in the comment section I saw the Kekubhai comment to remove him so i asked .

[Jaishree2310]

@lakshmirajvagu I have assigned this issue to you. Make sure you keep giving updates on your work. Happy coding!

[Jaishree2310]

@lakshmirajvagu Could you complete it within 2 days for better contribution? I am in the Loop of checking all the PR's and issues very carefully so I have to keep the consistency maintained.