#What I learned
The challenge of this project was to build an NFT card using HTML and CSS.
#My process
In this project I created first the HTML file, using semantic HTML and I applied class names to almost every element.
The second step was to create the CSS file, declare the variables and apply the appropriate style to the HTML elements.
#Challenges
One of the challenges of this project was to apply the overlay effect to the main image of the NFT when you are hovering over the image. This was done using the ::before and ::after pseudo-elements.
#What I learned
-CSS variables: This was my first project where I learned how to use variables in CSS. I declared all the variables for colors in the "root" and all the name of the colors were given using these variables.
-how to apply overlay effect: I learned to apply an overlay effect to an image using pseudo-elements(::before and ::after). The overlay effect was a background color and an icon which are not initially visible (applied opacity 0), but when we are hovering over the image they become visible by chancing the opacity to 0.5.