NFT preview card component with Grid and Flexbox

Community feedback

• 

  Doston Nabotov•950

  @dostonnabotovPosted over 2 years ago

  Hi, there. You can add an eye icon and background-color, using pseudo-elements. For example, in .card::before, you add background-color, and in .card::after, you add your icon as background-image. You have to make sure that both are set their opacity to 0. When hovered, in .card:hover::before and .card:hover::after, you add opacity to make it visible. You can view my solution as well if you want where I used this strategy.

  Marked as helpful

  1

  ---

  

  Marius•190

  @MariusHorPosted over 2 years ago

  @dostonnabotov I appreciate your feedback. It was really helpful, making me aware of needing to use pseudo-elements. I ended up using what you have suggested together with some other codes as well and it worked perfectly. I managed to turn the image into a link as well so this was great!

  0