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 solution

@nfluka

Desktop design screenshot for the NFT preview card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Community feedback

madhaus 1,040

@festsnusa

Posted

Hi there! Congratulations for completing this challenge.

Here's my feedback:

  • there's an empty div in your html file;
  • importing fonts instead of downloading them is not a good practice, because google fonts link may not be available;
  • in SCSS, putting "&" inside selector like this "& a.overlay" is not necessary;
  • to make your SCSS code look more concise, you can try mixins.

Hope you found my feedback useful. Happy coding.

Marked as helpful

1

@nfluka

Posted

HI @festsnusa,

Thanks on comment. Empty div is there for image hover effect , I was not sure how else would I go about that, maybe with ::before pseudo element?

I just started learning SCSS and comments like your are helping me a lot in better understanding on how all of that works. I did look into @mixin but I'm still unsure on how to start with that, or what part of code would be a good candidate for mixin. I just need more practice.

You are right on fonts, It smart to just download them, just in case something changes in future.

0

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