Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

NFT preview card component - SCSS

@ParaPaca

Desktop design screenshot for the NFT preview card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


What do you think are the best practices for this project? What am I supposed to do to improve my code?

Thanks in advance for your feedback 😊

Community feedback

Daniel 🛸 44,230

@danielmrz-dev

Posted

Hello @ParaPaca!

Your solution looks excelent!

  • I noticed that you used margin-bottom and padding-bottom to space the elements on the .card-text-wrapper flex container. Since the space values are very similar, using the property gap on the container might be a option too.

I imagine that you chose to use margins and paddings because the values were not exactly the same, but it's a suggestion to remember for cases in which you need to create equally sized spaces between elements.

Anyway, you did a great job!

Cheers,

Daniel

Marked as helpful

1

@ParaPaca

Posted

@danielmrz-dev Hello! Thank you for your answer!

When I made this project, I first of all thought about the exact similarity with the source (not having figma files on hand is quite time-consuming 😅). So I decided to go all-in and do it by eye, checking the screenshots provided in the task.

The gap property is very familiar to me, and I try to use it when necessary, as you correctly noted, with the same values.

Anyway, thank you very much for reminding me about this opportunity!

1
Daniel 🛸 44,230

@danielmrz-dev

Posted

@ParaPaca

I know how you feel, I also do the projects by eye... it's not the best option but it's what we got 😅

Anyway, I'm glad my comment was a bit useful for you!

And Happy New Year 😊

1

Please log in to post a comment

Log in with GitHub
Discord logo

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