Interactive rating [ Vanilla JS ]
Design comparison
Solution retrospective
Finally getting started on javascript challenges. I would appreciate some feedback regarding accessibility, as I tried to implement the keyboard navigation while also applying the hovered and selected states, but I'm not sure if the script was optimal. I also took the liberty to add a message whenever you try to submit without choosing a rating.
[UPDATE]
Uploading a new solution since I had to refactor the two forms styling as it was bugging the transition animation I tried to implement. In the end it turned out to be even simpler, since I didn't have to modify anything directly through javascript like before.
The issue involved hiding the content with display properties but I just couldn't get it to work using the reduced-motion media query, so I simply made use of positioning and hidden overflown instead.
I'm pretty satisfied with the end result and would love to hear any kind of feedback.
Community feedback
Please log in to post a comment
Log in with GitHubJoin our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord