order summary component

Community feedback

• 

  Lucas 👾•104,340

  @correlucasPosted about 2 years ago

  👾Hello Idev, congratulations for your new solution!

  Nice solution and nice results! You're in the right track.

  I've some suggestions for you to improve your code:

  1.Use background-size: container to have the wave svg background centered and well positioned:

  body {
      background-image: url(./images/pattern-background-desktop.svg);
      background-repeat: no-repeat;
      background-size: contain;
      background-color: hsl(225, 100%, 94%);
      margin: 0;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      min-height: 100vh;
      font-family: 'Red Hat Display', sans-serif;
  }
  

  2.You can use relative units as rem or em that have a better fit if you want your site more accessible between different screen sizes and devices. REM and EM does not just apply to font size, but to all sizes as well.

  ✌️ I hope this helps you and happy coding!

  Marked as helpful

  1
• 

  Adriano•38,270

  @AdrianoEscarabotePosted about 2 years ago

  Hi @IDev11, how are you?

  You did a great job on this challenge, but I have a few tips that I think you'll like.

  1- Document should have one main landmark, you could have put all the content inside the main tag click here

  2- Page should contain a level-one heading, you could have changed h2 to h1 [click here to read about it](https://dequeuniversity.com/rules/axe/4.3/page-has- heading-one?application=axeAPI)

  The rest is great! Hope it helps... 👍

  Marked as helpful

  1

  ---

  

  Idev•200

  @IDev11Posted about 2 years ago

  Hey @AdrianoEscarabote, I'm good, what about you, my friend?

  I have made the changes that you have mentioned above, thank you so much, they were really helpful.

  Have a nice day, my friend!

  1

  

  Adriano•38,270

  @AdrianoEscarabotePosted about 2 years ago

  @IDev11 thanks man. I'm glad to have helped you.

  Marked as helpful

  1