Skip to content
OverviewSolutions
7
Comments
7
jkaps9
@jkaps9

All comments

  • jkaps9•140
    @jkaps9Posted 3 months ago

    This looks decent, but you have some work to do to match the design.

    • It is snapping to the mobile layout at too wide of a screen size - you should set max-width closer to 768px instead of the 1500px you have currently.
    • The quote text on the white background is so low that it is hard to read, you should up the opacity to 70%. Check the style guide for recommended opacity.
    • In your CSS you should consider using custom properties (variables) for the colors which are used throughout the project.
    0
  • jkaps9•140
    @jkaps9Posted 3 months ago

    This looks really good!

    I like your use of variables in the CSS for the font size, family, and weights. I'm not very familiar with CSS Grid, but seeing your code showing the placement helped me learned something new!

    1
  • Ayomide philip•160
    @Ayomide-PhilipSubmitted 3 months ago
    What are you most proud of, and what would you do differently next time?

    Using Grid and Flex together

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

    I encounter a challenge when using grid

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

    @media query

    Product Preview Card Componet Main

    1
    jkaps9•140
    @jkaps9Posted 3 months ago

    Looks great!

    0
  • DolbyTheSheep•120
    @DolbyTheSheepSubmitted 4 months ago
    What challenges did you encounter, and how did you overcome them?

    The difficult part was drawing the lines in the table. I also got stuck a bit in the mobile layout, thinking how to resize the image over the padding of the div. Finally I added a new div and the problem was resolved :)

    Recipe Page

    1
    jkaps9•140
    @jkaps9Posted 4 months ago

    I think you need to decrease the font-weight on your headers to better match the design. Otherwise this looks amazing, nice work!

    0
  • jkaps9•140
    @jkaps9Posted 4 months ago

    HTML is missing the main tag which is standard in HTML5.

    Your screenshot doesn't seem to match your final solution

    Marked as helpful
    1
  • jkaps9•140
    @jkaps9Posted 4 months ago

    Amazing this is almost identical to the design!

    Looks like you're missing the <main> tag in your HTML.

    Marked as helpful
    0
  • Muhammad Umair Ali•90
    @bossthekhaniSubmitted 4 months ago
    What are you most proud of, and what would you do differently next time?

    I am proud of myself because I made it all by myself.

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

    While coding or building this layout, I didn't encounter any challenges.

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

    I whould help in Front-end areas.

    Creating a QR Code component in HTML & CSS.

    1
    jkaps9•140
    @jkaps9Posted 4 months ago

    Overall it looks really good! I think your font size is a bit smaller than the design solution which is causing it to look a bit different, but otherwise is spot on.

    Marked as helpful
    0