Mobile First QR Code Component

Community feedback

• 

  diego•110

  @dieghi-capriPosted 6 days ago

  To prevent unwanted scrolling, consider using padding-inline (for left and right) and padding-block (for top and bottom) in the CSS body, or simply use padding instead of margin. Also, you might try setting max-width: 400px; on the .container to eliminate the need for media queries. Everything else is spot on!

  I hope this advice helps.
  Diego.

  0
• 

  XiaobingHuang•10

  @XiaobingHuangPosted 6 days ago

  Great use of calc(100vh - 1px). It can prevent unwanted vertical scroll bars on some browsers.

  Replace margin with padding on body to prevent potential overflow issues.

  Import only the specific weights you need to improve loading performance. For example: @import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;700&display=swap');

  0
• 

  chiawenlin15121•10

  @chiawenlin15121Posted 6 days ago

  Looks great, but the component size seems to differ from design draft.

  0