TheNinza / dsa-visualizer

https://dsa-visualizer.vercel.app
MIT License
2 stars 11 forks source link

Add a change to dark theme feature on navigation for both mobile and desktop views. #12

Closed TheNinza closed 1 year ago

TheNinza commented 2 years ago

You can refer to this link https://mui.com/customization/dark-mode/#toggling-color-mode to get information on implementing dark mode toggle with material UI. Make sure to use same Icon Transition in the link mentioned.

No need to use some global state management library as prop drilling won't affect the performance that much, because the Navigation component is the immediate child of App component.

BelideNikhil commented 2 years ago

Hi @TheNinza, I would like to work on this issue. If you assign me this issue, can I add the theme toggler to the right side of the navbar beside navlink.

TheNinza commented 2 years ago

hey @BelideNikhil , I appreciate your response, but currently this issue is there for helping our college students to get familiar with open source. So if I get no response from anyone till tomorrow, I will assign this to you.

Manoramsharma commented 2 years ago

@TheNinza sir i want to work on this issue

TheNinza commented 2 years ago

sure @Manoramsharma , go ahead....

Manoramsharma commented 2 years ago

@TheNinza sir any new module is not getting recognized by App.Jsx , why is its so ?

Manoramsharma commented 2 years ago

@TheNinza, getting the following error for implementing the given theme Icon Transition.

./node_modules/@mui/icons-material/utils/createSvgIcon.js Module not found: Can't resolve '@mui/material/utils' in 'C:\Users\HP\Desktop\New folder\dsa-visualizer\node_modules\@mui\icons-material\utils'

Manoramsharma commented 2 years ago

Basic switch base transition is done already. Screenshot (27)

TheNinza commented 2 years ago

hey @Manoramsharma, sorry for the delay from my side. You can change the switch to logo that is here https://mui.com/customization/dark-mode/#toggling-color-mode It will be a better representation for the action. Also about that error.... it looks like that you are missing the dependency. Install it with npm

arushi2715 commented 2 years ago

Hey @TheNinza , I want to work on this.