Order summary component with scss

Community feedback

• 

  BalazsBanfi•280

  @BalazsBanfi

  Posted over 2 years ago

  Hi!

  Very nice solution. I want to suggest you some short advice.

  I think you could use the given svg mobile and in media query section the desktop file as backround-image,. The background-repeat property could be no-repeat and a background-size: contain. In this case the svg background pic will only one time on the screen.

  Maybe you could use in the html some classes for the same properities, because too much #id is a bit confusing and hard to read/understand the css file.

  for example these are in ypur code:

  #plan #plan-box {
    ...
  }
  #plan #plan-box #text {
   ...
  }
  #plan #plan-box #text h3 {
    ...
  }
  #plan #plan-box #text p {
  ...
  }
  #plan #plan-box #link {
  ...
  }
  #plan #plan-box #link a {
  ...
  }
  #plan #plan-box #link a:hover {
  ...
  }
  

  Instead of these you can use classes in the html.

  for example in html (<p class="bold">) and in css: .bold: {font-weight: 700;} And give all the <p> the "bold" class which you want to be bold, and so on the other properties..

  Keep going!

  00

  Marked as helpful