Skip to content
OverviewSolutions
1
Comments
2
Daniil Churikov
@ddosia

All comments

  • Daniil Churikov•10
    @ddosiaPosted 6 days ago
    1. the image is done through background-image of a div, instead of img tag. I see a problem with accessibility here: since in principle this is a QR code component, it shows a desired QR code of something and my guess as alt= in real world web site it would contain a description of what this QR code actually contains.
    2. Also I will relay some feedback I got from other members for the same challenge: wrapping things in divs when it isn't necessary should be avoided. I had to address this as well. Ideally the structure should be: div>img+h2+p and that's it.
    3. Paddings from figma are 16px from sides and 40 from the bottom.
    4. the font weights and family is good, but the size of the header looks smaller.
    0
  • GoldenDev74•10
    @GoldenDev74Submitted 24 days ago
    What are you most proud of, and what would you do differently next time?

    Je suis fière d'avoir pu faire ce petit challenge tout seul et aussi l'avoir rendu responsive

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

    aucun

    What specific areas of your project would you like help with?

    pas pour le moment

    QR code component with tailwind css

    1
    Daniil Churikov•10
    @ddosiaPosted 7 days ago

    Hey. I am a newbiew, so take my feedback with a grant of salt.

    1. Both header and description font doesn't match to style guides: slate-500/900 but rather gray-600/900, thickness and line-height is different. Although I am not 100% sure how to choose the right line height and thickness based on the design pictures nor on figma.
    2. You are specifying these colors directly, which might be ok to complete the challenge but for the real usage I can imagine it can present a problem if later color choices would be changed. I've defined my colors in the tailwind.config.js and used them further, so now if something needed to be adjusted there is one place it needs to be done.
    3. padding from the bottom should be bigger and padding from the rest of the sides - smaller.
    4. I like how you specified the size of the container and then put w-full on the image itself, this is something I should have done. I've tried to get the right size of the image based on the figma, and 18rem is something I came to.
    0