Desafio NFT preview

opa eai mano, para solucionar esse problema do hover é simples:

• da uma conferida no meu projeto
• criar uma div para colocar dentro a imagem da NFT e um container ou span onde dentro teria o svg, vai ficar algo assim no HTML:

<div class="view"> [div para agrupar tudo]

  <span class="view-content"> [span para o svg, onde vai ser da cor ciano de fundo]
       <img id="img-eye" src="images/icon-view.svg" alt="view">  [o svg em forma de olho]
  </span>

  <img class="img-nft" src="images/image-equilibrium.jpg" alt="image NFT">  [a imagem NFT]                 

</div>

• e a partir dai você aplica os estilos, para poder sobrepor e ficar um em cima do outro vai ter que usar o position; absolute no span.viewcontent e um position: relative na div pai dessa, na div.view e ai mexer no css usando hover e opacity :

view {
    position: relative;
    width: 300px;
    height: 300px;
}

.img-nft {
    width: 300px;
    border-radius: 8px;
}

.img-nft:hover {
    opacity: 50%;
}

.view-content {
    opacity: 0%;
    position: absolute;
    background-color: #00e8e461;
    border-radius: 8px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
}

.view-content:hover{
    opacity: 100%;

espero ter ajudado