Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Usei grid & justify-content

@mars2ks

Desktop design screenshot for the NFT preview card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


What are you most proud of, and what would you do differently next time?

Gostei por poder praticar o grid e algumas outras funções

What challenges did you encounter, and how did you overcome them?

Nas possições e no grid

Community feedback

@R3ygoski

Posted

Olá Mariana, parabéns pela conclusão do projeto.

Você colocou ali que que praticou o uso do grid, mas eu não vi nenhum trecho no seu projeto que estivesse utilizando grid, então não sei muito bem como ajudar quanto a isso, caso você tenha uma dúvida mais específica e puder comentar abaixo, aí tentarei ajudar da melhor forma possível.

No seu projeto ficou faltando fazer aquele efeito de quando passar o mouse na imagem, aparecer um ícone de olho e ficar um filtro azul por cima. Tem várias formas de fazer isso.

Optei por abrir um Issues no seu Github, para facilitar minha explicação, basta clicar aí no link.

E quanto ao seu HTML, ele está bem estruturado, só que está pouco semântico, e deixar o HTML semântico é importante tanto para o SEO da página quanto para questões de Acessibilidade, mostrarei alguns pontos que podem ser alterados:

  • <div class="desing"> poderia ser alterada para <section> por exemplo, isso porque o conteúdo presente nessa <div> é de uma temática semelhante entre si.
  • <div class="fim"> poderia ser um alterada para <footer>, isso devido a esse trecho representar o fim do card, então o <footer> faria mais sentido semântico nessa área.

E é isso, parabéns pela conclusão do projeto, caso tenha ficado alguma dúvida quanto ao que eu mandei no Issues ou aqui no FEM, por favor comente abaixo que tentarei ajudar da melhor forma possível.

0

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord