Frontend Mentor - NFT preview card component solution

This is a solution to the NFT preview card component challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.

Table of contents

• Frontend Mentor - NFT preview card component solution
• Table of contents
• Overview
• Links
• Built with
• What I learned
• update jan 29 2022

Overview

• this is my absolute first project
• since the card is already small i didn't add any responsive functionality to my project

Links

• Solution URL: solution URL
• Live Site URL: live site URL

Built with

• Flexbox

What I learned

• the opacity property
• the position of eye icon was a little tricky for me, just had one problem will notice that the cursor is not pointer when you hover over the eye
  
  however, the pointer appears when you hover over the image itself
  
  
• practice writhing this readme using Markdown Guide.
• i was using type selectors too much, i realized that it's harder to restructure my html document without changing the css file
• I also used IDs a lot, it was not ideal but anyways I kind of got the job done

update jan 29 2022

• I refactored the whole code
• I used grids to stack the icon-view on top of the image-equilibrium instead of the using posistioning
• the cursor is not pointer when you hover over the eye I fixed this issue