Design comparison
SolutionDesign
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!
Community feedback
- @ErayBarslanPosted about 2 years ago
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 helpful1@10highPosted about 2 years ago@ErayBarslan Thanks! I'll check that out!
I appreciate you taking the time :)
1
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