Interactive rating component with pure JavaScript

Community feedback

• 

  Elaine•11,400

  @elaineleungPosted about 2 years ago

  Hi Gurpreet, good job in completing this! I just got some comments about the buttons that you may want to take note of:

  1. Right now, when I click on a button, it turns orange very briefly, and then it turns gray. It's supposed to turn orange when hovered over, but you have that in the :active pseudo selector, not in the :hover, so do try changing it.

  2. I see that you used :focus for the selected button. The problem with using :focus here is that if I click on something else (like the background or the text), then the focus style is lost, and it looks like nothing got selected. You should use an actual class to make the selected style stick instead of using :focus. This is also not how the focus style is meant to be used.

  If you need some ideas on how to implement the selected style, check out my mini version of this challenge on CodePen: https://codepen.io/elaineleung/pen/RwMqMxZ

  Hope some of this helps you out!

  Marked as helpful

  2

  ---

  

  gurpreet•280

  @justcoder42022Posted about 2 years ago

  @elaineleung thank you so much

  1