@joshjavier
Posted
Hi Adarsh!
Nice work on your solution. I really like the subtle hover transition you added to the Add to Cart button. :)
In terms of accessibility, I noticed that you filled in a value for the button icon's alt text. This is repetitive since the button already contains actual text ("Add to Cart"). You can fix this by using an empty alt text (alt=""), which is the best practice according to WCAG. This should also fix the accessibility issue in your solution's report.
I also noticed that the card gets cut on mobile view because you set a height to the <body> element. You can replace this rule with min-height: 100vh so that the body element can expand beyond 100vh when the content can't fit. You can also add a padding of 1-2em to the <body> element to give the card a little more breathing room.
Happy coding!
Marked as helpful
