Card NFT feito com HTML e SASS

Community feedback

• 

  Felipe Chaves•240

  @loopchavesPosted about 2 years ago

  Iae, Bruno. O layout ficou muito bom!

  Você colocou o link errado do repositório. Tá o repositório da solução do QR-Code, mas ancontrei o reposiotrio certo no seu GitHub.

  Em relação a imagem do olho, você pode fazer assim no CSS em .container-imagem:

  background: url('../img/icon-view.svg') no-repeat;
  background-position: center;
  

  0
• 

  Lucas 👾•104,340

  @correlucasPosted about 2 years ago

  👾Oi Bruno Luiz, tudo bem? Parabéns pelo desafio!

  Esse tutorial aqui vai explicar exatamente essa questão do icone: https://www.w3schools.com/howto/howto_css_image_overlay_icon.asp

  Como eu fiz esse desafio há mto tempo, nem lembro exatamente como fiz, mas acho que foi um pseudo-element. Aqui minha solução caso vc queira consuktarhttps://www.frontendmentor.io/solutions/nft-preview-card-vanilla-css-custom-design-and-hover-effects-b8D1k9PDmX

  Quando esse NFT card vai ficando mto pequeno o texto começa a ficar muito colado, um jeito de melhorar isso é fazer com que a parte dos preços fiquem em linhas diferentes depois de uma determinada largura, por exemplo essa media query que apliquei pro seu código:

  @media (max-width: 350px) {
  body .container .container-info {
      display: flex;
      align-items: center;
      justify-content: center;
      flex-direction: column;
      gap: 12px;
  }
  }
  

  👋 Espero que essas dicas tenham sido úteis e continue codando!

  0