Mobile first using CSS flexbox

Community feedback

• 

  Joshua•25

  @minimalsmPosted almost 3 years ago

  Looking good @SJ-74 💪!

  Few suggestions to get it closer to the original design:

  • H1 font-size should be bigger (1.375rem)
  • I find setting padding on the bottom of the card instead of the paragraph text gives better (more flexible) control over the spacing.

  1
• 

  T

  Grace•31,270

  @grace-snowPosted almost 3 years ago

  This looks good. Try to tweak the shadow a tiny bit more, and looks like yours has a bit more space between the end of the writing and the bottom of the card.

  Are you trying to use BEM naming on this? There’s one class that veers off by having two sets of elements (proceeded with the double underscore). Text-section would be better there

  When writing scss I recommend against nesting part names like that. It is completely valid as an approach (I did that for years) but when you work on big projects, the scss becomes unweildy, hard to read and hard to debug. Nowadays it’s generally recognised that it’s only good to nest things directly related to a full class name, like pseudo states, pseudo elements or media queries

  I hope these tips help. Good luck

  1
• 

  Vanza Setia•27,775

  @vanzasetiaPosted almost 3 years ago

  👋 Greetings, there!

  🎉 Congratulations on finishing this challenge! One suggestion, I would recommend having an alternative text for the barcode image, like "QR Code". It's the main content of this page so it's important that all users know about it.

  That's it!

  0

  ---

  

  Vanza Setia•27,775

  @vanzasetiaPosted almost 3 years ago

  One more thing, I notice that you are creating BEE(block__element__element) <section class="main__text__section"> . This is not a valid BEM. I would recommend making it main__text.

  0