Order Summary Component

Community feedback

• 

  teamie•470

  @tea-scriptsPosted over 2 years ago

  Great work mate! Additional help:

  • Try as much as possible not to have your CSS styles internally. You should consider creating a .css file then place all your styling there. Helps w/ separation of concerns and maintain clean code and file structure.
  • You should also consider using semantic HTML instead of having divs all over your markup. For example your entire card is considered an article in HTML semantic.
  • You seem to also be missing the mobile layout which should have been your first approach(not compulsory).
  • You can place the "plan" in a container and try using the CSS Grid or Flexbox to style however you want.

  To achieve the pattern background, there are a couple of approaches you might want to consider but the easiest one which I can recommend i:

  • background-image: url(" ");
  • background-color: hsl();
  • background-position: and lastly
  • background-repeat:

  These properties would help you set up a default background image and also a default background color stacked on one another. You can learn more about Background Properties using this link.

  Keep up the effort and happy coding 👍!

  Marked as helpful

  2
• 

  Shashree Samuel•9,260

  @shashreesamuelPosted over 2 years ago

  Hey fayilmazdir, good job completing this challenge. Keep up the good work

  Your solution looks great however I think the following should be considered

  • The font family should be the one specified in the style-guide.md file.

  • Your card description needs some margin from the top using margin-top

  • The box shadow should be subtle to match the design

  In terms of your accessibility issues simply wrap all your content between <main> tags

  I hope this helps

  Cheers Happy coding 👍

  Marked as helpful

  1