QR CODE COMPONENT

Community feedback

• 

  Emmanuel Akpan•790

  @heisemmaco-devPosted over 1 year ago

  Hello 👋, Well done on completing the challenge! 🎉

  I can see that the image you uploaded did show because you did upload the image file to your github respository and you didn't center conter in the middle because you did add min-height: 100vh to your body tag.

  I hope this was helpful

  0
• 

  Brandon Rordriguez•300

  @MizunenPosted over 1 year ago

  You can get your image to show up by putting ./images/image-qr-code.png .you could center your container by giving the body a height and width of 100vh. You make sites responsive by using media queries and putting your desired styles for whatever size inside it. Ex of media query. @media screen and (min-width:1440px){ .container{ Whatever styles you want } } }

  I don’t think this project really needs a media query though.

  0
• 

  dimar hanung•560

  @dimar-hanungPosted over 1 year ago

  Hello 👋, Well done on completing the challenge! 🎉

  I have some interest and feedback with your code

  That i like:

  1. HTML is pretty good, not too nested 👍
  2. CSS Naming is also good, represent what is it for, like <div class="container"> for wrap another element / html tag
  3. Responsive until galaxy fold screen size 👌

  My Feedback and about your question:

  • I suggest you use html semantic convention, for example <div class="container"> to <main class="container">, it will make it clearer, and will improve seo if you want to submit your website to google, i recomended this article: here

  • You’re forgot to push images maybe? or have problem to push the image to github? it causing image is not appear

  • You can make it center by adding min-height:100vh, make body styles into this

    body {
        background-color: hsl(212, 45%, 89%);
        display: flex;
        justify-content: center;
        align-items: center;
        min-height: 100vh;
    }
    

  • You can seperate file by folder to be more structured ( just developer preference, not a rule ), for example:

    public/
    ├─ images/
    │  ├─ qr-code-image.png
    ├─ styles/
    │  ├─ main.css
    ├─ favicon.png
    index.html
    
    

  anyways overall is good, nice solution for first chellange, hope it useful 🙌

  0