order-summary-component-main

Community feedback

• 

  Aadvik•1,250

  @Aadv1kPosted almost 3 years ago

  Hey! Here are some fixes I would suggest you apply on your project.

  • Media query on mobile; You should add a media query for smaller screen sizes, maybe you can change the width or the spacing of the elements in the container element.

  • Semantic html; Semtantic html makes your code easier to read for both you and someone looking at your code. semantic html is basically.

    <article>
     <h2> Title </h2>
     <p> Blah blah </p>
     </article>
    

  is better and more redable than just putting everything inside a div. For more info You can check this out or you can check some of my projects out to see it in practice.

  1

  ---

  

  aropsta•110

  @aropstaPosted almost 3 years ago

  @Aadv1k Thanks for those links. This was one of the first projects I did several months ago, but am only submitting the solution now. I have since been learning semantic html, but I still struggle with it. It can be hard to know which elements should be semantic because sometimes I feel like I might need just a container that isn't a section or article. Hope I can learn more in the future!

  0
• 

  Zeynal Mardanli•180

  @LshirocPosted almost 3 years ago

  Hi, I think you should give more border-radius and shadow to the component. And also plan section needs more padding. And also component also should have more padding-bottom( or maybe you can give margin-bottom to button section). And background-image doesn't work for a reason. I think you should try to remove background-clip property(I'm not sure. I didn't know what is background-clip till now.) I wrote in my code like this:

  background: url('images/pattern-background-desktop.svg');
  background-repeat: no-repeat;
  

  I hope it will help Keep coding :)

  1

  ---

  

  aropsta•110

  @aropstaPosted almost 3 years ago

  @Lshiroc Thanks for your suggestions! I fixed the backgroung images not showing. I changed my path from url("images/image.png") to url("./images/image.png") git hub likes it better that way. Should be fixed now!

  0