Skip to content
Submitted about 1 month ago

QR Code Component

Puneet Kumar Sharma•70
@PuneetSharm
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...QR code component
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

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

I am proud of completing the task. I would like to fix the width and height of the paragragh 1 "Improve your front-end skills by building projects". I would like to add media queries.

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

I faced many challenges one of which was to put the component in the center of the page. I tried out a few things and took help from chatGPT by asking a doubt very specific to what I wanted.

What specific areas of your project would you like help with?
  • I would like to know about media queries, I would also like to learn more about transition: translate in CSS
  • I would also like someone to review the code and help me out to make it better

Community feedback

  • Henry Ihenacho•40
    @henrychrisPosted about 1 month ago

    This looks great! The only difference is the font/text. If you wish to make it pixel perfect, you could reduce the spacing between the letters in the text.

    0
    Puneet Kumar Sharma•70
    @PuneetSharmPosted about 1 month ago

    Thanks for the feedback @henrychris. But looking at the Figma file the letter spacing is needed in the 2nd text “Scan…..” of 0.2px and line height of 140%. Have I done something wrong while implementing the CSS?

    0

Please log in to post a comment

Log in with GitHub

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord