Interactive rating component

Community feedback

• 

  Hana•960

  @Hanka8Posted over 2 years ago

  Hi, nice job!

  Here are some suggestions:

  • the color of the background is #1f2630 and buttons have #262f38, you should find the colors at the provided file style-guide.md, or if you are using firefox - there is a built-in dropper feature;

  • use cursor: pointer and add some transition effects on your buttons and labels;

  • you should edit cards padding and width according to the design, i suggest using box-sizing: border-box for it, because thats how you can use padding that is not affecting your cards width;

  • its better to use <footer> instead of <div> for your attribution as it is more semantic;

  • <label> should not have a name, the name attribute should be just in the <input>;

  • I used buttons instead of inputs and put the submit cards html at the dom, then changed the state from display: none to display: block (and vice versa) by clicking the submit button - this is just the different option, you can check out my solution if you want;

  Keep up the good work!

  Marked as helpful

  0

  ---

  

  Bence Zámbó•510

  @zambobencePosted over 2 years ago

  Hey @Hanka8, Thank you very much for taking the time to review my code and for the feedback. I will apply them in my future projects as well. Your idea with the buttons is really great.

  Bence

  0
• 

  Bashar Khdr•930

  @BasharKhdr1992Posted over 2 years ago

  Nice Job. Congrats on completing the challenge. However, you might consider using a brighter color for the rating component background. One opinion, use the same color as the ratings buttons, then add some box-shadow around the buttons to make them separable from the background. That what I have done in my code.

  0