Submitted 8 months ago

NFT preview card

sass/scss, smacss

ardolynk-reborn•170

@ardolynk-reborn

A solution to the NFT preview card component challenge

Preview Code

Solution retrospective

What are you most proud of, and what would you do differently next time?

Here is a small reusable component to put icon and text inline

.inline
  display: flex
  flex-direction: row
  align-items: center
  gap: 8px

What challenges did you encounter, and how did you overcome them?

When refer an imported variable from @media statement, the source name is mandatory

@media (min-width: variables.$min-desktop-width)
  .card
    width: 21.5rem
    &--info
      &--title
        margin: 12px 0 8px 0
      &--attributes
        margin: 12px 0 12px 0
    &--creator
      margin: 16px 0 16px 0

Code

Please log in to post a comment

Community feedback

No feedback yet. Be the first to give feedback on ardolynk-reborn's solution.

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