Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Interactive rating component

Kevin H. 150

@kevinx9000

Desktop design screenshot for the Interactive rating component coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


My biggest struggles were:

  • the inputs and label styles for the ratings; took a long time to figure out how to set that up via HTML and CSS, so I'm looking for any suggestions there that would have been a more optimal approach
  • my first time tackling a challenge with JavaScript; that has been tough for me to learn, so any JS suggestions are great, too
  • starting to ignore getting pixel perfect with Frontend Mentor screenshots; the colors provided in the style guide did not all work (such as the circles around the ratings) so I had to make my own color for that; if I were to try to match their mobile design, then I would have to shrink the font size down as well, which seems unnecessary compared to just allowing the container to grow on mobile and keeping the font size legible; also ignored paragraph font size of 15px, because it again seems unnecessary

Community feedback

Please log in to post a comment

Log in with GitHub
Discord logo

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