Skip to content
Submitted over 2 years ago

Interactive rating component using HTML, CSS and Js

Swaraj•110
@swarajzz
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Interactive rating component
  • HTML
  • CSS
  • JS
1newbie

Design comparison

SolutionDesign

Solution retrospective

It is my second attempt on this challenge and my first javascript project using DOM manipulation. I have added custom outline, box-shadow and hover effects. And the most challenging part for me was the javascript logic. Many thanks to @bunee and @Elaine for providing crucial feedback and helping me solve it.

Happy to hear feedback and advice!

Community feedback

  • Faraz_•200
    @GeekkyCoderPosted over 2 years ago

    hey @swaraj really amazing job here! i have a question , i did the same my question from you is, what was the border property you used for this little circular animation! fantastic job

    1
    Swaraj•110
    @swarajzzPosted over 2 years ago

    @GeekkyCoder I really appreciate that.

    I think you are referring to the outline property. For that I've used

    *:focus { outline: 4px dotted hsl(217, 12%, 63%); outline-offset: 4px; }

    1
    Faraz_•200
    @GeekkyCoderPosted over 2 years ago

    @swarajzz ok thanks, i followed you on github as well 😉

    1

Please log in to post a comment

Log in with GitHub

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