Rating component using Vanilla JavaScript

Community feedback

• 

  Nelson•2,390

  @nelsonleonePosted almost 2 years ago

  Nice , congrats on completing the challenge , you can set a < width and aspect-ratio of 1/1 > on the spans so the can be round shaped when you add border radius,

  For clicking the spans , (though using buttons would be also good) you can use JS , using the forEach method to remove all active buttons before making the clicked on active .

  span.addEventlistener(....... document.querySelector(span).forEach(span => { span.remove.classList('active') })

  e.target.classlist.add('active') )

  0
• 

  Dytoma•550

  @DytomaPosted almost 2 years ago

  Hey👋 Congratulation on completing this challenge, I really like your solution.

  Here are some improvements you can implement to your code for accessibility:

  • The proper way to build the "rating buttons" in this challenge is to create a form and inside of it, there should be five input radios and each input should have a label attached to it to make the buttons accessible. Finally wrap all the inputs and labels inside a fieldset to prevent users from making more than one selection.

  You can read:

  • MDN <input type="radio">

  • MDN <fieldset>: The Field Set element

  This is one of the recommendation I got on my solution that I think you can implement to your code too.

  Good Job👏

  0