QR code component

What are you most proud of, and what would you do differently next time?

I am especially proud of the time it took me to finish this project. I estimated around 2 hours but managed to finish it in an hour. I am also happy with finally being comfortable using CSS flexbox since it has always been a bit of a struggle.

I would probably rethink the css properties that I have used for the overall layout. I am not sure is flexbox for body, and flexbox + position: absolute for the main component and footer is the best and common solution.

What challenges did you encounter, and how did you overcome them?

The most challenging parts were:

• the layout of the page: should I use flexbox? Is the combination of flexbox and position: absolute for the footer the best option? Should I use grid for this page?

In the end I've decided to use flexbox & position: absolute for the footer for the overall layout.

• how to fit the image of the QR code.

I've set it's width to 60%, but I am not sure if that's the best solution.

What specific areas of your project would you like help with?

I would be grateful for the feedback regarding:

1. the overall layout solution: flexbox on the body + position: absolute on the footer. Is it a good solution and a common one?
2. resizing the QR code image to fit the box? Is my solution to set it's width to: 60% a good one? Is there a better way to solve that part?