Responsive QR component

Hello @Mr-Azeez!

Your project looks great!

I have a few suggestions for you to improve it:

• I noticed that you used margin to place your card closer to the middle of the page. Here are two simple and very efficient ways to do it without margins or paddings:

• You can apply this to the body (in order to work properly, you can't use position or margins):

body {
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}

Or you can apply this to the element you wanna center:

.element {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
}

• You could also give the text a little padding. They are too close to the borders.

I hope it helps!

Other than those little details, you did a great job!

Thanks a lot @Daniel I'll do just that