Interactive Rating Component created with HTML, CSS and JS.
Design comparison
Solution retrospective
Feedback is always welcome.. in order to improve my coding skill. Thank you for giving feedback.
Community feedback
- @MikeBish13Posted over 2 years ago
Great effort on this challenge!
In terms of functionality, the main issue I see is that I'm able to select all of the numbers and then submit the form, whereas the brief states that only one number should be selected and submitted. See if you can figure out a way of getting this to work.
Another thing I've spotted is that you've used camelCase as a naming convention for your CSS classes. The standard naming convention for CSS is hyphenated (eg. user-name, user-id, etc) so I'd suggest adopting this to save yourself a lot of confusion in the future. Here's a good article explaining a bit about naming your CSS classes, and how BEM is a very useful and widely used convention. Maybe give it a try in your next project!
Keep up the good work!
Marked as helpful1 - @AlexuvaPosted over 2 years ago
Hey @i-am-Khael ! Nice job! I got a few suggestions to improve your solution:
-
If you declare the max-width: 1440px in the container that wraps the content of the page instead of putting it on the body, the content will stay in better shape at the largest screens.
-
The JS is nice, but you could improve it by making that loop check if there is another option already picked, in that way, you could only mark one option before submitting.
Happy coding!!
Marked as helpful1 -
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