nft-card

For Active state or hover while moving cursor to the Ethereum image we need to use ":hover" attribute with "div" containers.

kindly refer the w3schools how to create image hover text overlay effect below,

Ref -1 Ref -2

-The card looks squished on phones

You could have used rem for the container width instead of viewport-width

#To get the green filter effect over the image# -Wrap the image and an empty div in a div

• give the parent div a position relative and child position absolute. -then

.child {
left:0;
top:0;
height:100%;
width:100%;
opacity:0;
background-color: color;
}
.parent:hover .child{
opacity: .3;
}