Design comparison
Solution retrospective
Hi there, lets matear 🧉 😁 This is my solution for the Product Preview Card
Solution Repo:octocat:
I'm very happy doing this kind of project to improve my performance skills.
- I used SASS to improve my skills in CSS and minified the file to get better performance. 🚀
- I got %88 of Performance in PageSpeed Insights.
- Used BoilerTemplate HTML5 to get better compatibility and accesibility for users.
- This project is responsive for desktop, tablets and mobile using bootstrap and custom media queries.
For the last please feel free to leave your feedback or advice and thanks for reading!💪
Community feedback
- @FluffyKasPosted over 1 year ago
Heyo,
That looks great! I haven't completed this challenge yet, so not sure if it includes some hover styles for the button, but regardless it would be nice to see some, even if you had to come up with it yourself ^^
You also have a somewhat unnecessary alt text on your cart icon (its just a decorative image), you could leave the alt text empty so screen readers don't read it out needlessly.
The border-radius is also a tiny bit messed up in mobile view (works fine in desktop view, so I guess just needs a media query).
So overall really well done, it's a neat solution!
1@arrejoriaPosted over 1 year ago@FluffyKas thanks for the advice. It was really late, when i commited the solution i dont realice that my layout in mobile was that bad haha
Very happy for your comment! ❤️
PS: in the layot the button has an active style, only change bg color
0
Please log in to post a comment
Log in with GitHub
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