Design comparison
Solution retrospective
I structured my css/scss files in a better way, I used media queries to make my page responsive and I used :before
to style my lists.
It was challenging to determine the correct sizes and proportions of my elements without the Figma file.
What specific areas of your project would you like help with?I'd some tips about responsiveness.
Community feedback
- @R3ygoskiPosted 7 months ago
Olá novamente Murilo, mais uma vez, parabéns pelo seu projeto, ele ficou muito bom.
Eu não consegui ter acesso ao projeto finalizado ele quando cliquei no "Preview Site", ele abre uma página do Github que está dando erro 404, e aconteceu o mesmo quando tentei fazer isso no Github.
Mas bom, sobre as dicas de responsividade, eu não vejo muito o que pode ser dito, a forma que você utilizou as @media está correto, a única dica que posso dar sobre isso seria relacionada a projetos Mobile-first, onde você começa fazendo o projeto se baseando em telas menores e adapta-o a telas maiores, é uma forma que talvez possa ser mais intuitiva, é só uma abordagem diferente pra trabalhar com responsividade.
Agora algumas dicas no geral, sobre seu HTML, uma coisa pequena, nessa sua
<div class="recipe-image">
você poderia ter usado uma tag<figure>
.E agora sobre a estilização, uma outra forma, que é até mais simples, de estilizar os bullets da lista, seria a de utilizar a pseudo-classe
::marker
, deixarei aqui um link mostrando sobre ela: W3School - ::MarkerEdit: Acabei de ver que você atualizou o seu projeto, agora ele está aparecendo. Notei que seu projeto está quebrando em tamanho de 425px até 750px, acredito que isso seja por causa da @media que você utilizou, talvez se você utilizar ela em um valor maior, ele fique mais correto.
E novamente, parabéns pelo projeto concluido, se tiver duvido quanto a algo que eu disse, já sabe.
Marked as helpful0@MuliroMattPosted 7 months ago@R3ygoski, muito obrigado pelas dicas, vou pesquisar sobre tudo o que você falou, tenho certeza que vai me ajudar bastante.
1
Please log in to post a comment
Log in with GitHubJoin 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