Design comparison
Solution retrospective
How the solution came out considering I had to eyeball the designs without using a figma document.
What challenges did you encounter, and how did you overcome them?No figma file (may subscribe).
Lots of trial and error to get the design to a place I am happy with without any defined design styles
What specific areas of your project would you like help with?Just any insights or anything spotted that isn't like the designed document from my solution.
Community feedback
- @ItsZubekPosted 23 days ago
The design looks good, although a little more testing would be nice to get it to look closer to the design, but overall is good.
As for the coding part, the HTML file looks good, as for the css - I have to point out that using fixed values (
px
) for images might not be the best idea because of the responsive aspect of the component. If you'd just set the width, the height would adjust automatically. And usingrem
would make the design more versatile.Same goes for fonts, using
px
might not be the best idea - userem
instead.When it comes to the list part of the code the only thing I would point out is again, setting the
width
property to a fixed value. What would happen if you made the text within that list longer? Try setting thewidth
to 100% and instead of usingheight
usepadding
to make it the right size. If you were to change thefont-size
property the height would remain the same and you'd need to adjust it manually. Using padding makes the button scale automatically to thefont-size
property.Marked as helpful0 - @AuroreLPPosted 23 days ago
I was going to talk about the size of the card and some other details, but then I realised you didn't have access to the figma file, so congratulations to you.
Another advantage of the Figma files is that you can download the cursor SVG to have exactly the same in the prototype.
Your code looks good and efficient. With all the data, your solution would have been perfect!
0
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