Kukkee icon indicating copy to clipboard operation
Kukkee copied to clipboard

Dark Mode

Open anastr0 opened this issue 3 years ago • 5 comments

Everyone needs Dark Mode!

anastr0 avatar Jan 30 '21 18:01 anastr0

Hi, can you assign this issue to me? I would like to work in it

manishprivet avatar Mar 09 '21 11:03 manishprivet

Hi, can you assign this issue to me? I would like to work in it

Hey @manishprivet! Since #62 is not over yet, I think we should wait for the web design for the MVP to finish and then look into dark mode. Thanks for showing interest anyway! Also, if you're good at UI/UX, you're welcome to take up #62.

anandbaburajan avatar Mar 09 '21 11:03 anandbaburajan

My approach for dark mode was by using css variables, and changing those variables through a single button, all blackboxed in a single component. It doesn't require the MVP to be finished. We can assign those variables to the MVP later on too

manishprivet avatar Mar 09 '21 11:03 manishprivet

My approach for dark mode was by using css variables, and changing those variables through a single button, all blackboxed in a single component. It doesn't require the MVP to be finished. We can assign those variables to the MVP later on too

Sounds good, but to be open with you, the styling parts of our code don't follow best practices. We don't have a dedicated UI/UX member on our team so the CSS might be troublesome to you. So we were thinking about reworking on the CSS. Can you go through our CSS and let us know what you think? You're also suggested to join our Gitter chatroom by the way. Thanks!

anandbaburajan avatar Mar 09 '21 11:03 anandbaburajan

@manishprivet Thanks for your interest in contributing. You can start working on this. You can also help us in #62 if you're interested.

But please note that we're using Nextjs and poll pages( rocketmeet.me/poll/[pollid] ) are ssr. Which means, the page is rendered in server and the user's theme preference is stored in the client's browser. This might lead to a flash each time a poll is rendered. So make sure to handle that if you're using css variables.

Alternatively, you can make use of redux, redux-persist and somehow store theme preference in the server itself.

Look into it and tell us if you have any trouble. Thanks! :D

anastr0 avatar Mar 09 '21 12:03 anastr0