Design comparison
SolutionDesign
Solution retrospective
It was bit harder when i was trying to add an icon to the button which is shopping cart. Which i haven't done before. However, able to add that after watching a youtube tutorial.
Please check my code and provide improvements i will be so pleased for your contribution. Thanks a lot.
Community feedback
- @chinh1402Posted about 1 year ago
Congrats on finishing the challenge 🎉, I have some suggestions for you to improve the design of the card
- The challenge has a style-guide, you should follow its layout instruction because when the FEM try to take the image of your solution, it won't look good To actually design on a 1440px layout, You should follow these steps: press f12 to enter inspect mode, then use Ctrl + Shift + M (for Edge). On the top part you will see 2 numbers, Change the first number to 1440px then press enter, Now, you should be able to design on 1440px resolution
- The Montserrat font is easily legible, I think it is supposed to be applied on the description part of the page; while Fraunces should be used for the heading... Cause this is a perfume product, Faunces will give that soft and elegent feeling when reading while Montserrat is too bulky.
- You should add your card with border-radius to smooth out the edges
- The button has an icon that is too close to the text. You should add some more margin for them
Hope you find my suggestions useful
Happy coding ✌
Chinh.
Marked as helpful0
Please log in to post a comment
Log in with GitHubJoin 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