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

Testimonials Grid Section - Next.js/Tailwind/TypeScript

Nick 170

@nickabate

Desktop design screenshot for the Testimonials grid section coding challenge

This is a solution for...

  • HTML
  • CSS
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


What are you most proud of, and what would you do differently next time?

I was able to generate most content dynamically through a constants file, in addition to generating Tailwind styling specific to certain colour themed cards.

What challenges did you encounter, and how did you overcome them?

In generating certain dynamic content, I learned that my Tailwind config had to be modified to pick up changes from different content sources.

What specific areas of your project would you like help with?

Any suggestions to improve on the sizing of grid elements would be appreciated. There is empty space at the bottom of some of the testimonial cards and I'd like to work on minimizing empty space when using grid layouts.

Community feedback

@vgarmy

Posted

I think you use React in a good way in this task. That you separate the design from the content. Using Tailwind is also good, but you haven't got the size of your boxes correct. I have no solution to your problem as I have never used Tailwind. But slightly wider boxes are needed.

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