Responsive landing page using CSS Grid and Flexbox

Community feedback

• 

  P

  Robert McGovern•1,075

  @tarasisPosted about 2 years ago

  Hi Matt, congrats on your solution. First I'm impressed you built out the design system as an html page. Looks identical to my memory of the figma file. Might help some out who want to take a stab at the challenge themselves.

  I like that you added some .sr-only bits for the social icons, although I don't think the brackets are needed :)

  Interesting seeing font sizes categorised by their font weight. I think I've seen Kevin Powell doing that too.

  Good to have both a btn class and then specific iOS and Android buttons.

  I would suggest if you are going to do multiple media queries as you have, to use a variable for the width so you don't have to repeat the numbers. Could lead to a subtle difference if you use 43 for most, then one thats 42 or 44.

  Looking at responsive design mode I'd suggest breaking at 1200px so the fullstop isn't over the top right image. (Rather than 1153px) That said, your build is MUCH more responsive than mine. I built the middle area the wrong way around. So looks pretty poor from Tablet to Desktop sizes.

  Anyway congrats, and all the best 👨‍💻

  Marked as helpful

  0

  ---

  

  P

  Matt Pahuta•580

  @MattPahutaPosted about 2 years ago

  @tarasis Thanks, Robert! Great feedback I will definitely take to heart and I really appreciate you taking the time. Cheers!

  0