Skip to content
Submitted over 3 years ago

NFT preview card component using semantic html, css, React and webpack

react, semantic-ui, webpack, bem
Indika Kolamba Tantrege•60
@iamindika
A solution to the NFT preview card component challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

Any feedback for the semantic markup of my NFT preview card would be really appreciated. I also welcome any react and styling advice/tips. Thank you!!

Code

Please log in to post a comment

Log in

Community feedback

  • Web Wizard•5,690
    @rsrclab

    Hi, @iamindika ~

    Congratulate on your solution to the challenge on FM platform. I have studied your work carefully and learned a lot from it.

    Here are some of the tips I like to provide.

    • On smaller devices, card goes over screen, and I think max-width: 100% can solve this issue.
    • I suggest you to try transition on hoverable elements like heading and creator name.

    https://www.frontendmentor.io/solutions/my-first-solution-on-chanllenge-V-4IzAivH

    Here is my solution to this challenge, and if it can help you even a bit, it would be happy to me.

    Cheers ~

    Marked as helpful
  • Indika Kolamba Tantrege•60
    @iamindika

    I'll certainly look at using that max-width css property more, especially for mobile layouts. I do in fact use a transition on all the hoverables, but it's not so obvious (too fast) on the heading and author. I'll fix it! Ty for the feedback Tymur!!

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