Skip to content
Submitted 7 months ago

Recipe-Page

yoe7501•410
@yoe7501
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 are you most proud of, and what would you do differently next time?

I like that I got to make use of a grid layout and figured out how to make lines seperating thet content using background color.

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

I had a hard time making the card a certain size no matter how big the window was but figured it out at the end.

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

I would like a good amount of styling tips to make this project easier and some css syntax tips to potentially have less lines of code next time.

Community feedback

  • Isaac-Victor Providence•100
    @Emoji123-sPosted 7 months ago

    Hi @yoe7501, amazing work with the project. Upon previewing the webpage, it is accessible, but the font-color of the entire page elements is the same. Color references were provided in the style-guide.md in the project folder, so you can check that out to fix the colors to match the design template. The mobile view looks good, and responsive too, but it doesn't match the mobile design template, and the margins for the image seem to be a lot when moved to the mobile. Basically, the container is supposed to span the entire page for the mobile view, and the image should lose its margins and span the top, while responding to changes in screen sizes.

    With these changes, your project will be much more like the design. Have fun! 😉

    Marked as helpful
    0
  • Covenant-0•100
    @Covenant-0Posted 7 months ago

    To start with, you did a great job with this project. However, you are to try to replicate the given design as close as possible. The only issue i see with this code is the font-color. The main font color is black but you used dark raspberry throughout the body of the code. Asides from that, i think your code is perfect.

    0

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