downforacross / downforacross.com

Web frontend for downforacross.com -- continuation of stevenhao/crosswordsio
https://downforacrosscom.downforacross1.now.sh
MIT License
229 stars 90 forks source link

Allow users to change their colors #147

Closed ewmson closed 3 years ago

ewmson commented 3 years ago

This PR adds in the ability for a user to change their colors. To keep the UI clean I went with the circles picker of react-color which does limit the options that can be picked from, but is much less intimidating.

A user can change their color by simply clicking on the dot next to where they edit their name and selecting the new color.

Here is a video of that being done:

https://user-images.githubusercontent.com/6018559/105261348-5a8c9b00-5b44-11eb-8d12-d9c7decbcea8.mov

The other users are able to see the changed colors of that user:

https://user-images.githubusercontent.com/6018559/105261538-a9d2cb80-5b44-11eb-99b7-209711964fea.mov

closes #88

vercel[bot] commented 3 years ago

This pull request is being automatically deployed with Vercel (learn more).
To see the status of your deployment, click below or on the icon next to each commit.

🔍 Inspect: https://vercel.com/downforacross/downforacrosscom/c3k3x50rx
✅ Preview: https://downforacrosscom-git-fork-ewmson-user-colors.downforacross1.vercel.app

ewmson commented 3 years ago

I did not do too much thinking on the discoverability here (how do users know they can change their color if they click on the dot).

Any suggestions are welcome.

stevenhao commented 3 years ago

This is awesome! Thanks so much for the contribution. Looks like a lot of the code for this feature already existed -- I probably had intended to build it at some point but forgot 😂 .

Re discoverability: Perhaps you can make cursor: pointer (see first inline comment)?

I also added some other style comments & questions; let me know if they make sense! Happy to discuss in more detail if they don't.