Skip to content
Submitted over 2 years ago

RESULT SUMMARY - REACT & TAILWINDCSS

react, tailwind-css, animation
Sameer Singh•560
@SameerJS6
A solution to the Results summary component challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

Hello, Frontend Community,

This is my official solution for the Result Summary Component. This challenge was fun to do as it only involved CSS and the UI was quite beautiful.

I added some extra features to make it even cooler, such as:

  • SVG icons for titles and buttons
  • A background pattern to give the body some texture
  • A gradient animation for the result container and circle
  • A loading animation to make it more interactive.

If you have any opinions or feedback, please leave a comment. Thanks for checking it out! SameerJS6.

Code

Please log in to post a comment

Log in

Community feedback

  • Grace•32,130
    @grace-snow

    Hi

    The background image makes this unreadable for me.

    And do you think each item of the results would be clickable? What do you think would happen on click? The content looks static to me, but I can see transitions as I touch each one on mobile, which makes me think they’re interactive

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