Skip to content
Submitted over 3 years ago

QR code component solution using CSS

Yash Goswami•70
@Yash-devasp
A solution to the QR code component challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

I have complete my first challenge on frontendmentor.io and with this I am starting a new journey on this path. I had a lot of fun completing the first assignment.

As I am a beginner and have just started learning about web a couple of days back so I am sure my code can be improved. Please help me in my journey by pointing out ways in which my code can be improved or if there could be a better way to tackle a problem.

Code

Please log in to post a comment

Log in

Community feedback

  • Naveen Gumaste•10,420
    @NaveenGumaste

    Hello Yash Goswami ! Congo 👏 on completing this challenge

    Let's look at some of your issues, shall we:

    • Why use <p class="head">Improve your front-end skills by building projects</p> you should use h1 here as it is title of the card

    • the background shadow is very dark so make it more soft

    • Read style-guide and add the font-style and size along with weight

    • Add equal padding or margin for the qr img and the texts

    happy Coding😀

  • Abhik•4,820
    @abhik-b

    👋 Hello Yash ,Congratulations on completing your 1st challenge. Your solution is fantastic & it is very responsive 🤩👌

    Some of my opinions I am sharing with you :

    • give margin: 0; to *{ } to remove unwanted margin from all elements
    • remove the height from card & give gap:1em to make the card look more like the design
    • your box-shadow is very nice

    Very Well Done 🤩 & Please keep coding such amazing solutions 🥳👍

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