Skip to content
Submitted 3 months ago

Recipe page solution

Kevin Rasata Andrianome•60
@kevinrasata
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Recipe page
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

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

This was actually the first challenge that I took on Frontend Mentor.

I can tell you struggled big time with the layouts. Hahahah!

Like it took me 3 days to figure it out.

But now I'm more confident with it and the other challenges felt easy afterwards.

I guess good practice makes perfect?

Community feedback

  • Thomas James•160
    @turtlethomPosted 3 months ago

    Hey Kevin, solid layout!

    I was checking out your design of the recipe page in Google Chrome. One thing I saw was around 700px view width, some of the text gets cut off on the left before transitioning to the mobile design.

    • I saw it in Chrome, but I'm not sure if it's affecting other browsers.
    • It's probably just a small adjustment with your media queries, but it's hardly noticeable.

    Other than that, great job! It looks like a 1:1 ratio to the solution!

    PS: Huge fan of your use of CSS variables throughout your application as well as your naming conventions :)

    Marked as helpful
    0
    Kevin Rasata Andrianome•60
    @kevinrasataPosted 3 months ago

    Thanks so much for your feedback man! I really appreciate it :D

    1
  • Adhi•240
    @Adhi-S12Posted 3 months ago

    Looks great! 👍🏻

    Marked as helpful
    0
    Kevin Rasata Andrianome•60
    @kevinrasataPosted 3 months ago

    Thanks @Adhi-S12
    I really appreciate it! :D

    1

Please log in to post a comment

Log in with GitHub

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord