Skip to content
OverviewSolutions
7
Comments
14

Aziz Najjar

@Njoura7Hungary, Pecs260 points

Computer Science student & Web Developer

Latest solutions

View more solutions

Latest comments

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

    First time using more complex ARIA and Form attributes.

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

    Since first time using ARIA would appreciate knowing if I implemented it correctly and if I missed any important ones.

    Also was not sure if there was a better alternative to using sections so much.

    And while it works it feels kind of like a kludge the way I replaced the radio button with the SVG as shown in the design images.

    Form with ARIA and Javascript toggled custom errors

    1
    Aziz Najjar•260
    @Njoura7

    Good work! I didnt check frontendmentors for a while and I was thinking that it would be nice to get back on track and give some feedback to some fellas who are doing their best. So overall you did good, just focus more on the paddings and margins they really add a lot of values to the design You can read this article about white spacing and its important

    • I can also notice some extra border-width in the first 3 fields

    • Keep it up and hopefully with consistency and a lot of passion and practice you become a frontend developer or enhance your skills in this field if you are coming from different background

    • See you soon hopefully I will be posting again some work in the platform ;) , so let's keep in touch

    Marked as helpful
  • Aziz Najjar•260
    @Njoura7

    hello friend, your solution looks good, but I guess you forgot to change the font family and some line heights :D good coding journey

  • Aziz Najjar•260
    @Njoura7

    Hello mate, your work is almost perfect, and I like how you are customizing your Readme section, lot of people don't do it x'D, I also liked the smooth animation that you ad I'll consider adding it to :D

    there is a small detail that might improve your solution, which is giving a gap between the two cards of 30 px, and then make the width of the right card a bit smaller

    Marked as helpful
  • Aziz Najjar•260
    @Njoura7

    hello friend, good job for this project, and congrats for your first project on github here are two tips that might improve your project give the body a display flex like this body{ display:flex; justify-content:center; /to center the container horizontally in your case/ alignm-items:center; /to center the container vertically in your case/ } another method to do it without flexblox is to center your container directly: .container{ position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); }

    the other tip is to give your QR code img a width of 90% or 85% instead of max-width:100%; or you can give your container a padding of 1rem maybe hope it was helpful :D

  • Aziz Najjar•260
    @Njoura7

    Hello friend, good job for your project, you're almost there, here are two tips that might help you improve your solution. 1)try to give a bigger width to your container (75% or 80%) 2)give more width to your img container and give it a background-size:cover; so it can cover the whole space hope it was helpful, good luck in your code journey :)

    Marked as helpful
  • Aziz Najjar•260
    @Njoura7

    hello, nice try you are almost there ! here is what you should do:

    <div class="container"> <img src="images/image-header-desktop.jpg" alt="Image" class="image"> <div id="overlay"></div> </div> you should nest your image with another div and then give .container{position:relative;}

    #overlay{ position:absolute; width:100%; height:100%; }(so that it takes the whole space and then add the color with a specific opacity between 0.5 and 0.2 maybe)

    Marked as helpful
View more comments