Product preview card component with Tailwind CSS

Community feedback

• 

  Hikmah•1,070

  @HikmahxPosted over 1 year ago

  Hi Talisson 👋, Nice work there! Tailwind can be a bit overwhelming at first, especially as a newbie. I remember not wanting to use it but because I kept seeing it everywhere, I decided to give it a try. And I don't regret it. Almost all my projects use Tailwind and I'll continue to use it in the future. That being said, I have some tips for you:

  • I think it'll be better to add some space at the top and bottom of the card in smaller devices, perhaps of the tailwind class py-4 in the div immediately after the main.
  • The title should be smaller on mobile devices, like text-3xl, and prefix the class text-5xl with md: (tablet) or lg: (desktop).
  • For checking accessibility, you can install the Chrome extension Wave. I recently discovered this and it's very useful. Just right-click on the page after installing Wave and you can wave the page.

  Hope this helps you

  Marked as helpful

  1

  ---

  

  Talisson•190

  @talissoncostaPosted over 1 year ago

  Thanks for the helpful tips @Hikmahx Yep, I was feeling the same. It seemed too verbose to me.. but as long as you are getting used to it.. classes just comes in your mind...

  I'll have a look on that.. Thanks so much!

  0