Skip to content
Submitted over 1 year ago

QR Code Component [Mobile First + Vanilla CSS + Responsive]

accessibility
Aakash Verma•9,540
@skyv26
A solution to the QR code component challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

Any feedback welcome, Made it within 1 hour. I am great learner and I will be happy to hear anything regarding design and code in order to enhance my skills. Feel free to share your thoughts.

Code

Please log in to post a comment

Log in

Community feedback

  • P
    David Turner•4,130
    @brodiewebdt

    That didn't take long.

    Marked as helpful
  • Danilo Blas•6,300
    @Sdann26

    Very fast! Good work Aakash :)!

    Marked as helpful
  • Anosha Ahmed•9,300
    @anoshaahmed

    pixel perfect

    Marked as helpful
  • Hania B.•1,280
    @techanthere

    @skyv26 that's awesome! And here I am still planning to complete this cute looking challenge :) And hey just a little suggestion, footer text is flowing over the card, when the height is decreased, I think you don't really need to use position property for this solution, instead just stick with some padding and for the footer some margin.

    Marked as helpful
  • Aniket Khot•50
    @aniket53

    brother can u help me to get the right course for the react js learning i also wanted to learn it

  • Kacper Kwinta•1,405
    @kacperkwinta

    My advice on the names of variables in css - use those that do not directly describe the color, but, for example, what elements they should belong to, because when you change the value of a variable, its name loses its sense

    Also you shouldn't use <main> tag for box with these elements, because this tag is for grouping elements, not for styling

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