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

Amit Kumar 100

@amit-kumar-18

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


  • The image in thank you window seems to load slower than the rest of the page.
  • Submit button has a weird outline on the upper corner.

These are my main concerns any other feedback is most welcome. " I have created a fun little animation on the star feel free to explore."

Community feedback

@themegazord

Posted

Hi Amit Kumar, congratulations on the solution.

Answering your question, the weird border, you would have to use the border: 1px solid transparent; to 'take off' any border that might be, since we set it to transparent.

Corresponding to the delay when loading the image, try just creating it via HTML, and just set or not display: none, in the div to disappear and continue respecting display: flex the next time it stays.

One last tip, the organization of your folders, you can create an assets folder and inside it create two more, with the name css and js and inside each, insert the responsible file for each folder.

Don't forget to mark it as helpful :-)

0

Amit Kumar 100

@amit-kumar-18

Posted

@themegazord appreciate your feedback. I have updated my solution and all the problems are now solved including the border and image delay.

1

@zaks276

Posted

Hello Amit. Good job on the solution. I like the little animation. Its a nice touch.

  • To remove the border on the submit button use border: none; in your CSS.
  • As for the slow loading image, I believe it is due to rendering the thank you window via Javascript. I've noticed the same effect with other solutions that used this method.

I hope this was helpful.

0

Amit Kumar 100

@amit-kumar-18

Posted

@zaks276 thank you I really appreciate your feedback. That slow loading was indeed caused by Javascript so I hard code the image section into HTML and switched its display via CSS and javascript.

0

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