Criado usando html e css

Community feedback

• 

  James•340

  @James-aldersonPosted about 2 years ago

  Hi Bruno Ginél

  I have created a pull request in your repository, you can review the changes and add the changes to your design.

  Marked as helpful

  0
• 

  Lucas 👾•104,400

  @correlucasPosted about 2 years ago

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

  Acabei de dar uma olhada na sua solução e te posso dizer que os componentes não estão responsivos porque você usou várias vezes width o melhor jeito seria você substituir todas essas propriedades com max-width pra deixá-lo responsivo permitindo o conteúdo se ajustar junto com o container.

  Agora pra ter o mesmo efeito de overlay roxo na foto, basta você colocar mix-blend-mode: multiply; no seletor da imagem pra fazer o mesmo efeito.

  Se você quiser ver a minha solução pra entender como eu montei a estrutura aqui está o link:

  https://www.frontendmentor.io/solutions/stats-preview-card-vanilla-css-custom-design-text-animation-RfGBFlMpwK

  👋 Espero ter ajudado e continue no foco!

  Marked as helpful

  0
• 

  James•340

  @James-aldersonPosted about 2 years ago

  Hi Bruno Ginél, I saw your design, It is a good design, but there are a few issues that you can fix to help improve your design.

  As follows:

  • Create a folder called 'assets' and put all the files related to the challenge inside it.
  • Define your web fonts inside css, by doing this you have helped the HTML code to be seen better.
  • Set the value of the 'lang' attribute to 'en', because the challenge you are designing is in English.
  • Add "favicon" to your challenge.
  • It is better to use the naming method 'BEM', because in this way you will have a neat code.
  • Using the 'image' element, you can change the image according to the width or height of the resolution.
  • Use 'custom propery' as it makes css coding easier.
  • Use the "flexbox" method to centering element on the page.
  • Design for mobile resolution.
  • Add design screenshots.
  • ...

  These are tips to help improve your design, you can see all the changes in the commits section.

  By the way, I have created a fork in your repository, you can add all the changes to your challenge.

  If you are just starting to learn design, no problem. I also faced these kinds of problems at the beginning of my work. My suggestion is that before you start the new challenge, watch of the tutorial videos I'll link to below, as this will help you improve your design.

  • Improve your design.
  • Learning BEM

  Do not forget to practice, because the more you practice, the better and faster you will design.

  Happy coding

  0