Interactive Rating (HTML, CSS, JS)

Solution retrospective
My very first challenge using JavaScript, yay!
Feedback specific to how I implemented the Javascript would be appreciated. If you have a better/cleaner solution, I'd love to see it to compare.
Thanks!
Please log in to post a comment
Log in with GitHubCommunity feedback
- @ErayBarslan
Hey there, congrats on your solution! Design looks good and is responsive. You have clean usage of ES6 I like it :) You can optimize the code by using
focus
CSS selector and a little change on JS logic:.ratingButtonInactive:focus { color: white; background-color: #FC7614; } /* You won't need active class in this case */
... const ratingClicked = event => { document.querySelector("#ratingSelected").innerHTML = event.target.innerHTML; } /* isAnyButtonSelected() isn't needed */ const submitClicked = () => { if (document.querySelector("#ratingSelected").innerHTML) { document.querySelector("#rateUsRequest").hidden = true; document.querySelector("#ratingFeedback").hidden = false; } } ...
These should be enough to refactor. Happy coding!
Marked as helpful
Join 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