Skip to content
OverviewSolutions
11
Comments
10

Amanda Buttineau

@ab1820Ontario, Canada200 points

Programming, techy stuff, farm life, my animals. Stay at home mom, looking to become a Front-End Developer.

I’m currently learning...

CSS3 - Grid & Flexbox - Javascript - Git - Python

Latest solutions

View more solutions

Latest comments

  • Amanda Buttineau•200
    @ab1820

    You honestly did a wonderful job!! Good job, and keep it up!! :)

  • Amanda Buttineau•200
    @ab1820

    This one is great!! You did awesome!

  • Amanda Buttineau•200
    @ab1820

    Unsure as to why the screenshot is not matching up, but the live site does match up.

  • Amanda Buttineau•200
    @ab1820

    Hey there!

    Your QR Code looks great with the fonts, colors, spacing, etc. The only thing I would recommend is tackling that large empty space at the bottom of the QR that extends to the bottom of the page. Check to see if your padding or margin for the bottom of your design is too much.

    • also noticed that you repeat the html and body selector a couple times, try and refactor your code to clean it up a bit and it helps to make things easier to read.

    I took a look at your code and noticed you added some 100vh. In a design like this, you don't really need to add any height as the margin and padding throughout the design around the font and title should expand the white background that you were looking for. Try removing the 100vh and see what happens!! :)

    html,
body {
  min-height: 100vh;
}

    body {
  height: 100vh;
  background-color: var(--light-gray);
  font-family: "Outfit", sans-serif;
  display: grid;
  justify-content: center;
  padding: 2rem;
}

    Otherwise, great job and congrats! :)

    Marked as helpful
  • Amanda Buttineau•200
    @ab1820

    Hey there!! Here are some of my insights:

    1. You should always try to remember to add a README page, a screenshot of your challenge would be a nice touch, also the read me allows you to explain how you went about doing the challenge and applying different styles, etc.

    2. Just from looking at the preview, I can see that you did not apply any padding or margins which in turn makes your design look a little more squished than the challenge. Try playing around with those to see the outcomes! 3.Colors and font are spot on!! :)

    Otherwise I dont see any real issues with your design just besides the padding and margin issues. NBD! Practice, and learn! :) You also managed to get the responsivness working which is awesome!

    Happy Coding! :)

    Marked as helpful
  • Amanda Buttineau•200
    @ab1820

    Hey lady!!! :) I just wanted to point out the border-radius around your card! Otherwise it looks awesome and I think I may try this challenge next! :P

    Marked as helpful
View more comments