Order Summary Challenge Solution

Community feedback

• 

  Roberto Yukio Miyamoto Arita•320

  @RyukioMiyamotoPosted over 2 years ago

  @RJC26 I use Figma for this purpose, it's not optimal but you can open the design files and measure the spacings with it. I tried using VisBug too, which is a chrome extension, but I had a hard time using it, but it's worth a shot

  Marked as helpful

  1

  ---

  

  Ryan•290

  @RJC26Posted over 2 years ago

  @RyukioMiyamoto Thanks man thats honestly a massive help, im going to try figma so that alteast as you said I can measure the spacings and that should help with matching the designs with less guessing. your a hero my friend!

  1
• 

  Roberto Yukio Miyamoto Arita•320

  @RyukioMiyamotoPosted over 2 years ago

  You just missed a few details like the shadows, and the background image could cover everything by using background-image: contain, but you did a great job overall! As for the extensions, I would recommend using Lighthouse, for checking accessibility, SEO, perfomance and more, for both desktop and mobile.

  Good coding!

  Marked as helpful

  1

  ---

  

  Ryan•290

  @RJC26Posted over 2 years ago

  @RyukioMiyamoto AHH Jeez thats what i was looking for with the background I was trying to use background-size: cover; but couldnt get it going so I ended up settling for what I achieved! Thanks will defo get lighthouse, also I was wondering if there is any extension or program where you can open an image and do on screen measurements. So when you get the templates you could measure pixel lengths more accurately? Thanks for the help!!

  1