Skip to content
OverviewSolutions
4
Comments
4
JP Felicia
@Hiraeight

All comments

  • sour413•50
    @sour413Submitted about 2 months ago
    What are you most proud of, and what would you do differently next time?

    I am proud of that I understood media query format in CSS and got help to make this project Responsive friendly in all devices and got help from some members from Frontend mentor to get knowledge of making webpages responsive friendly in all devices which I achieved in this project, next, time I would look onto improve more on developing responsive pages and apps.

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

    The only challenge I have is proper alignment in mobile device, so, I am expecting help from some of the members, on this proper alignment of webpage in mobile device.

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

    I would like help with to make more responsiveness of this webpage in mobile devices and tablets, expecting help from members and Frontend mentor community.

    Recipe Card Responsive

    1
    JP Felicia•60
    @HiraeightPosted about 2 months ago

    Hi there fellow coder! You did great with your solution, and I would like to give some of my suggestions on how to make your coding to the next level!

    • You can apply some font weight on your headers to give it some highlight for the readers (eg. Ingredients, Instructions, Nutrition)
    • You can apply padding on your 'card card-recipe' to give some spacing and to make your content look like it is centered.
    • I also noticed a type on your header below the image. I think it is missing an 'e'

    Overall, you did a great job and keep it up! Continue on learning and inspiring others. Cheers!

    0
  • samuelbm12•60
    @samuelbm12Submitted about 2 months ago
    What are you most proud of, and what would you do differently next time?

    I am Proud of the fact i did the project without any help and next time i would add a bit of JavaScript to it

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

    I really did not have any encounter

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

    Just how to use Grid, I know it is not related but i would like to know on my grid

    Social Profile Link

    3
    JP Felicia•60
    @HiraeightPosted about 2 months ago

    Good Job! It is nice to see a fellow coder is making progress. I would like to suggest some small ways to make your solutions to level up.

    • Media Queries: Introduce media queries to adjust styles based on the screen width, ensuring the layout is optimized for small, medium, and large devices.
    • Text and Font Size Scaling: It is better to use responsive text sizing with rem or viewport-based units like vw or vh so that fonts adjust with screen size. A friend named Fraser Jubb suggested to me this video and it helped me a lot. He did an amazing job applying these practices.
    • Using a <main> tag inside the <body> of your HTML is a best practice because it clearly identifies the main content of your page. This helps with accessibility and improves how search engines understand your content. - Steven Stroud

    Amazin job! Keep learning and keep improving!

    Marked as helpful
    0
  • JP Felicia•60
    @HiraeightPosted about 2 months ago

    Hello! your solution looks great! I just have one suggestion, I noticed that when I view your solution in small mobile view, 320px width to be exact, the yellow background stopped covering the whole background. You can fix that by applying the color in the body instead of in the hero class.

    ex. body { background-color: hsl(47, 88%, 63%); {

    but then again, I'm quite new so maybe there is a better solution for this. If so, I would love to know too. But overall, I can say that your solution passed. Keep it up!

    0
  • JP Felicia•60
    @HiraeightPosted about 2 months ago

    Your design has additional designs that made it so much better. It looked nice when you show the border and gave your h1 a shadow. Your CSS is very clean too. Keep it up and continue to inspire others.

    0