Responsive Blog Review Card without Media Queries

Community feedback

• 

  Bernardo Poggioni•6,490

  @R3ygoski

  Posted about 1 year ago

  Olá Murilo, seu projeto está muito bem feito, se assemelhando muito ao design proposto, parabéns.

  Começarei falando sobre a responsividade, sempre quando vamos trabalhar com responsividade, é comum o uso das media queries, elas servem para delimitar um escopo onde os estilos responsivos serão aplicados, mas, você também pode tentar fazer isso utilizando funções como o clamp() e propriedades como min-height ou min-width, max-height ou max-width, só que essas abordagens ao meu ver são bem mais limitadas, então sobre responsividade eu recomendo media query mesmo.

  Agora, sobre seu SCSS, ele está bem feito, uma dica que dou sempre a respeito disso, é fazer projetos na metodologia BEM, que BEM e SCSS funcionam com perfeição. E uma questão mais de organização, você poderia pegar as suas variáveis e o reset, e passar para um arquivo _variables.scss e _reset.scss respectivamente, que dessa forma você deixa mais organizado, daí para usar eles basta colocar no topo um @import ou @use, dessa forma:

  @use './variables' as var;
  
  .meu-elemento {
      background-color: var.$minha-cor;
  }
  

  E sobre seus clamp(), aparentemente estão todos corretos sim.

  E novamente, parabéns pela conclusão do seu projeto que ficou muito bem feito e semelhante ao design proposto, esse transform também deu um charme a mais. Caso algo que eu tenha dito não tenha ficado claro, por favor, comente aqui embaixo que tentarei ajudar da melhor forma possível.

  12

  Marked as helpful