Design comparison
Solution retrospective
Tried my hand on JS with full dedication, and also took the help of youtube, whenever I got Stuck. Any suggestion on how I can improve more and better will be helpful....
Community feedback
- @AbsorberendPosted about 2 years ago
Hey man,
Looking good! You're doing great!
I added a little bit of JavaScript to add a class to the rating you clicked to change its colors. This is what I came up with:
ratingNo.forEach((e) => { e.addEventListener("click", () => { ratingTaken.innerHTML = e.innerHTML; ratingNo.forEach(rate => rate.classList.remove("rating_yes")); e.classList.add("rating_yes"); }) })
I renamed the .rating_no:target CSS class to the following:
.rating_yes { color: hsl(213, 20%, 22%); background-color:hsl(217, 12%, 63%) ; cursor: pointer; }
Basically what this function does it adds the .rating_yes class to the rating you clicked. But right before that it checks and removes the .rating_yes class from all the other ratings so you wont have any duplicates.
I hope this helps my man, keep it up!
Marked as helpful0
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