Product preview card component HTML, CSS

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

Ce dont je suis la plus fiere, c’est d’avoir réussi à reproduire le design de manière fidèle, aussi bien sur mobile que sur desktop. J’ai également bien compris comment utiliser Flexbox et les media queries pour gérer le responsive.

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

Le plus gros défi a été de gérer l’image du produit : elle était parfois déformée ou coupée sur certains formats. J’ai appris à utiliser object-fit, max-height, et les unités comme clamp() pour l’adapter correctement sans perdre en qualité visuelle.

J’ai aussi eu du mal avec les breakpoints. J’ai finalement trouvé une bonne organisation en testant avec les outils de développement du navigateur.

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

J’aimerais savoir s’il existe de meilleures pratiques pour gérer les images dans un layout responsive sans passer par trop de media queries.

Je suis aussi curieuse d’avoir des retours sur l’accessibilité de mon bouton (j’ai utilisé aria-label, mais je ne suis pas sûr de tout faire correctement).

Enfin, je serais ravi d’avoir un feedback général sur le code CSS (organisation, lisibilité, simplicité).