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

MobileFirst Interactive Rating Component with TailwindCSS

#tailwind-css
Yash Kadam 280

@yash-278

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


Hi, FrontEnd Mentor Community, this is my solution for Interactive Rating Component Challenge.

I took the liberty to add a back button so user can change rating, instead of refreshing the whole page.

Due to using a lot of ReactJS, I completely forgot localStorage is available directly in VanillaJS, instead I was thinking it would require a npm library 😅

Feedback Welcome 😊

Community feedback

CyrusKabir 1,885

@CyrusKabir

Posted

Hello my dear friend ♥ you did very good on this challenge and here some improvements for your component :

  • changing some typography here can make your component get closer to main design like adding line-height to body tag or higher value for card title font-size;
  • your component it's good for working with mouse :( but for example, if one day my mouse breaks down or many other things that force me to use the keyboard, there is no way to work with your component !!
  • and another important thing is, I can hit submit button without choosing any rating number !! (a little validation needed)

Marked as helpful

1

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