Skip to content
Submitted over 2 years ago

Interactive rating, changing styles upon submit

Camille•130
@fyrfli
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

One of the things that has had me stuck for a couple of days is that I read that you need to removeEventListener() after processing is complete but I haven't found any solid explanations on the different ways to do that yet. That is something I need to research some more before I do any more in-depth functionality in JS. I am well aware of pages that end up going on and on and on and hanging the browser and want to write code solid enough to avoid that kind of overhead.

Any ideas/thoughts/suggestions?

Community feedback

  • atanasov36•640
    @AtanasovCodePosted over 2 years ago

    Hi, looks like you did a great job!

    From my observations I can see that you have a few styling issues:

    • Your card is not correctly centered, you can also try and fix the sizing of the card because it looks like yours is a bit larger then the original design.
    • The rating buttons, you can try and make their background into a perfect circle because now they are a bit thinner on top and look more oval shaped.
    • Add cursor: pointer when someone hovers over the submit button and the rating buttons.

    Hope some of my feedback helped, I did the exact same challenge and you can go see mine and give me some feedback too :)

    Marked as helpful
    0
    Camille•130
    @fyrfliPosted over 2 years ago

    @AtanasovCode I actually accidentally discovered how using grids can center the components on the page vertically so I updated that.

    I actually forgot about the pointer. I will update that ASAP.

    And ... ah yes ... I see that the rating buttons are more oval than circular. Fixing that now too.

    Thanks so much for your feedback!

    0

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