QR code component solution using CSS Flexbox

Community feedback

• 

  roopxx•120

  @roopxxPosted 8 months ago

  @HussainAzimi, you did it really well, esp. the box-shadow around the main component ( I struggled for that and aligning the image ). However I would like to make note of the component not being centered vertically, maybe trying out column flexbox can come handy or perhaps auto margin along y axis ;-)

  0

  ---

  

  HussainAzimi•120

  @HussainAzimiPosted 8 months ago

  @roopxx, thanks for your feedback

  0
• 

  Sipan Ahmad•160

  @sipanahmadPosted 8 months ago

  Good Job, keep going. You just need to change the description text color to : .description p{ color: var(--Grayish-blue); }

  0

  ---

  

  HussainAzimi•120

  @HussainAzimiPosted 8 months ago

  @sipanahmad, Thanks for your feedback

  0
• 

  geektim•230

  @geektimPosted 8 months ago

  Hi there, this is a beautiful job done. Well done! As regarding the centering of your card to the middle, you could consider the following: making your background display: flex; justify-content: center; align-items: center;. Or you could make your background position to be relative, then the card's position to be absolute, then you set top: 50%; left: 50%; transform: translate(-50%, -50%); on your card. I hope you find this helpful.

  0

  ---

  

  HussainAzimi•120

  @HussainAzimiPosted 8 months ago

  @geektim, Thank you for your feedback

  0
• 

  Akhil•40

  @code-suraPosted 8 months ago

  Excellent work!

  A suggestion:

  Try to have good contrast ratio for the text. Especially the paragraph text. Readability is more important and is the most important criteria for a good design.

  0