QR code component

Community feedback

• 

  Moritz Rose•90

  @moritzrosePosted over 1 year ago

  Thank you so much! That helped a ton!

  0
• 

  Shahjahan Sarfraz•270

  @Jahan-ShahPosted over 1 year ago

  Hi Moritz 👋, weldone on solving your challenge. I'm here to answer you questions.

  • You need to import all the font weight you want to use in your style. So how you select the font weights is that you go to the font on google fonts and scroll down to styles of font, you'll see all the weights of that font, now click select on right side of all the weights you need and then copy the import link. i.e if you want to use bold outfit font the import should look like this:

    @import url('https://fonts.googleapis.com/css2?family=Outfit:wght@900&display=swap');
  

  • Units will not make your design responsive, but try to use relative units like rem, em etc instead of absolute units like px

  • To make your design responsive you flexbox or grid and media queries.

  Lastly here is an absolute amazing tutorial on responsive by Ramzi - Slaying The Dragon make sure to check this out and learn responsive design easily.

  I hope this will help.

  Shahjahan

  0
• 

  Sadeep Ariyarathna•120

  @elemenceORPosted over 1 year ago

  Hey Moritz, did you include the weigh 900 when you selected fonts from google font? the import should look something like this,

  <link rel="preconnect" href="https://fonts.googleapis.com">
  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  <link href="https://fonts.googleapis.com/css2?family=Hanken+Grotesk:wght@500;700;800&family=Outfit:wght@400;700;900&display=swap" rel="stylesheet">
  

  0

  ---

  

  Shahjahan Sarfraz•270

  @Jahan-ShahPosted over 1 year ago

  @elemenceOR He importing the font in his css file without weights

  0

  

  Sadeep Ariyarathna•120

  @elemenceORPosted over 1 year ago

  @Jahan-Shah Thank you. I just notices

  0