search

samz5320 / Data4ALL

A spot for all the datasets you need.
https://samz5320.github.io/Data4ALL/
18 stars 97 forks source link

Dark and Light UI Transition | Improvement #48

Open pooja-gera opened 3 years ago

pooja-gera commented 3 years ago

Greetings!

When we transition from the light to the dark mode or vice-versa, the transition is not smooth.

Suggested Improvements:

  1. We can add a smooth transition which makes the look and feel of the application better.
  2. In the light mode, the switch has a circular icon, and in the dark mode, the switch has a moon icon. We can either add circles for both light and dark mode or add sun and a moon to maintain uniformity.

Do suggest any changes or further improvements. It'll be super if I could be assigned this issue.

Thanks and regards, Pooja Gera

samz5320 commented 3 years ago

Do you mind waiting for a bit pls? cause the author of the previous merge on this issue hasn't completed his code yet. He still has to make some minor changes. Once he's finished ill assign it to you. Then you can view the changes and discuss them?

h2o-Noob commented 3 years ago

I can work on this issue, i have previously done added dark themes and transitions of themes to my practice websites. please assign me this issue

ShivVIT2019 commented 3 years ago

Can You Please Assign to me??????

samz5320 commented 3 years ago

@pooja-gera go ahead pls. try not to do major changes. attach screenshot with ur PR.

pooja-gera commented 3 years ago

Sure thank-you! @samz5320

pooja-gera commented 3 years ago

Hey @samz5320 I just noticed the toggle switch has been updated on the website, should I update the toggle switch too? Or should I just make the transition between the two color themes smoother?

samz5320 commented 3 years ago

Smoother for now.

pooja-gera commented 3 years ago

Okay, got it! ^.^

pooja-gera commented 3 years ago

Hello I am done with this feature.

Here is how the toggle transition looked before: currentToggleState

Here is what I have updated: updatedToggleState

Explanation: The transition between the light and the dark colors has been synced with the transition of the toggle switch. When the toggle switch is moving towards the dark mode, giving an effect that nightfall is coming over the application and similarly when the toggle switch is moving towards the light mode, an effect that daylight is coming over the application is given.

Please let me know if everything looks okay or if any other changes are required. I'll submit a PR then ^.^

samz5320 commented 3 years ago

Looks gud! Submit ur PR .