order-summary-component

Community feedback

• 

  Alamin•2,000

  @CodeWithAlaminPosted almost 2 years ago

  Hi Mohamed Abdeldayem👋 Great job on completing this challenge! 🥳

  I noticed a few areas where your solution to the challenge could be improved, and wanted to share my suggestions with you.

  • Instead of using a hard-coded height value for the .bg-im element in the CSS file, you could use the vh unit to set the height as a percentage of the viewport height. This would allow the element to scale up or down based on the size of the screen. For example:

      .bg-im {
          height: 100vh;
      }
  

  • You could use a semantic HTML element instead of a div element for the header of the card. For example:

      <header class="card-header">
          <h3> Order Summary</h3>
      </header>
  

  • You could add some accessibility features to the page, such as providing alternative text for the images and adding proper alt attributes to the img elements. This would make the page more accessible to users with disabilities. For example:

      <img src="images/illustration-hero.svg" alt="Illustration of a person listening to music on a device">
  

  Overall, this is a very well done solution to the challenge. Great job!

  Hope I'm Helpful! 👍

  Keep up the good work! 😊❤️

  Marked as helpful

  0

  ---

  

  Mohamed Abdeldayem•70

  @abdeldayem8Posted almost 2 years ago

  @CodePapa360 thank you for your advices i made it

  1