Skip to content
Submitted over 3 years ago

Responsive Testimonials Grid - BEM, SASS, CSS Grid

shiva santosh jana•375
@santu369
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Testimonials grid section
  • HTML
  • CSS
2junior

Design comparison

SolutionDesign

Solution retrospective

Used Grid for the desktop layout. Added small keyframe animations on page load. Used prefers-reduced-motion media query for removing animations for users who set reduce animations in settings.

Appreciate feedback/comments on code structuring or any improvement.

Community feedback

  • Patrick•14,265
    @palgrammingPosted over 3 years ago

    Looks good the only thing would have been to make a middle transition between the mobile and desktop layout. Something like two columns of cards for the tablet and small desktop sizes to see instead of the one column stretched so much. With Grid Area Templates it makes it so easy to reorder things

    But over all you did a very good job on this challenge

    0
    shiva santosh jana•375
    @santu369Posted over 3 years ago

    Hey @palgramming, Thanks for the feedback, I was working on the middle transition and chose to submit the current solution to know if there are any issues. I've updated the tablet view just now.

    Appreciate the feedback Patrick.

    0
    Patrick•14,265
    @palgrammingPosted over 3 years ago

    @santu369 ⭐⭐⭐⭐⭐ Looks Great... Good Job that extra transition completes it

    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