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

@MartinsitoBritoDiaz

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


Hello Frontend Mentor commnunity!!

I had an issue in this project because the background of the main card has a color kinda wear, so I did my best to replicate that gradient. Any feedback is welcomed.

Community feedback

David 8,000

@DavidMorgade

Posted

Buenas Martinsito, buen trabajo terminando el challenge! te quedo muy bueno el rating card!

Solo una cosa que creo que se te a pasado añadir, cuando hacer click en uno de tus rate--button debería de pintarlo como de color naranja para que el usuario sepa que botón selecciono una vez que quite el cursor, esto lo puedes hacer facilmente en tu forEach(), más o menos debería ser algo así:

sectionRate.forEach((element, i) => {
    element.addEventListener('click', () => {
        saveSelection = i+1;
        element.style.backgroundColor = 'orange';
    })
});

Y listo con eso ya conseguirias el efecto.

Espero que mi feedback te sea de ayuda para tus proximos proyectos, sigue así!

Marked as helpful

1

@MartinsitoBritoDiaz

Posted

@DavidMorgade Perfecto, lo solucionaré de inmediato. Muchas gracias por la ayuda. 🫂

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