QR code component design

Community feedback

• 

  Carsten Körner•170

  @carstenkoernerPosted 8 months ago

  Hi, I have also just uploaded my first solution. But I would still like to make a few suggestions.

  1. Firstly, read Grace’s comments on my solution. You can use them completely for your solution. Link to Grace’s comments

  2. You can use rem instead of working with px everywhere. The advantage of using rem is that all sizes depend on an initial size. If you adjust this - all other sizes and ratios adapt. This makes it easier to adjust responsive displays. The default font size in this project should be 15px. You can use this as the font size for the body-element and thus serves as the initial size, as it is inherited by all subordinate elements. By setting the initial size, you define 15px as 1 rem. So if you want to use 20px somewhere, for example, you convert this to 1.6rem.

  3. Read the definition of BEM. BEM can help you to bring a better structure to your CSS. This is not necessary in small projects like this one, but can help you later in larger projects. https://getbem.com

  4. Your page does not behave responsively if the screen width becomes smaller. In this project, it is sufficient to work with max-width and not define the height at all. Height must be able to adapt flexibly via the content.

  JM2C

  Marked as helpful

  0

  ---

  

  Prince Eze•60

  @princeezePosted 8 months ago

  Hi, @Carsten. Thanks a lot for the detailed solutions and helpful resources. I have implemented all of them. Let me know if you have any other thoughts.

  0