Skip to content
OverviewSolutions
2
Comments
4
P
Zugim
@Zugim

All comments

  • ElijahOluwasegun•30
    @ElijahOluwasegun
    What are you most proud of, and what would you do differently next time?

    I would say I am most proud of not giving up on this project. Early on, my computer died while working on this project erasing all my data which made it hard to concentrate on finishing the project. I am glad that I pulled through to finish this challenge.

    One of the things I would probably do differently is to be patient with myself, not being in a hurry to finish while enjoying the process.

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

    One of the challenges I encountered was finding the right resources to help me solve the challenge. I overcame this by reading various articles, resources and watching videos extensively. Additionally, I also joined communities that helped to improve my knowledge about HTML and CSS.

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

    I would love help with writing a good commit message. I would also love help with CSS flexbox, specifically where the class = qr_sect. I was wondering if there is a way for the whole qr-code component to be in the center of the page both horizontally and vertically without using margin properties as I did.

    Responsive QR Code using CSS display properties

    3
    P
    Zugim•80
    @Zugim

    Looks really good! Nice job. I'm probably not the best person to help you with writing good commit messages so I'll leave that to someone else to answer. As for centering both horizontally and vertically it can be achieved easily with both flexbox and grid.

    Centering horizontally and vertically

    The above link should get you started.

  • P
    Zugim•80
    @Zugim

    Looks good. It might be worth looking into css variables, they are especially useful for colors. While they aren't super necessary for small projects like this one they can be useful for bigger projects. If you want to experiment with the projects colour scheme you only have the change the colours in one place.

    https://developer.mozilla.org/en-US/docs/Web/CSS/Using_CSS_custom_properties

    Marked as helpful
  • RoxySash•190
    @RoxySash
    What are you most proud of, and what would you do differently next time?

    I am proud that I completed this. It took a while but its complete.

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

    I couldn't figure out why there is a scroll bar. It was hard to structure all the divs I made.

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

    Flexbox and centering elements

    QR CARD CSS FLEXBOX

    2
    P
    Zugim•80
    @Zugim

    It looks great! Apart from the sizing it is looking super close to the original design.

    To maybe fix the sizing I would look at removing the div blue-area-behind and instead applying the blue background colour directly to the body. If you then make the body display property flex hopefully you will be a bit closer to the original design.

    It's worth noting that children of elements that display as flex automatically become flex-items so should shouldn't need to set all of your elements to display flex.

    When I was first learning flexbox this course by Wes Bos really helped me out.

    https://flexbox.io/

    Really good job! Keep it up 👍

  • P
    Zugim•80
    @Zugim

    Looks great. My only slight critique would be that the entire component appears to be slightly smallar than the original design. Maybe you could inspect the Figma design to find the exact width and height of the white containing box.

    The box shadow matches the design very closely. Nice job.

    Marked as helpful