All solutions

What are you most proud of, and what would you do differently next time?

I'm proud that I didn't encounter any challenges while developing this project. One thing I want to do differently next time is to set fewer media queries, or ideally, none at all if possible.

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

I didn't encounter any challenges in this project. :)

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

The areas where I would like your help or feedback are my CSS. I've been implementing Cube CSS in my projects, but I'm not sure if I'm doing it correctly :)

Your feedback will help me improve even more.

**CODE UP ☕🧑‍💻 ! **

What are you most proud of, and what would you do differently next time?

The things that I'm most proud of with this challenge are:

1. When I figure it out how to create the multi column layout, I'm still not sure if it's best practices on manipulate the grid even though you didn't set any grid-template-rows

2. I applied what I learn in Andy Bell's talk, If you interested here is the link to the talk “Be the browser’s mentor, not its micromanager"

The only thing that I would apply differently next time is how I structure my Cube CSS. I'm not sure if I did it right. Let me know your feedback !

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

The challenge that I encountered on this is implementing the multi-column layout or the grid layout. I overcome this challenge by trying different values on the grid-column and grid-rows and tinkering the grid property.

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

The area that I can use your help with is the Cube CSS, This is my first time implementing it. I know for sure that there are a lot of improvements and refactoring for the code.

Give me a feedback if I have some excessive codes in my CSS I would really appreciate it

Your feedback for this project will be really important to me | Thank you !

CODE UP 🧑‍💻 !

What are you most proud of, and what would you do differently next time?

I'm most proud of how I take the challenge on the responsiveness of the card. The thing I would do next time is to limit my media query. I think the responsiveness of this project can be done even though there is no media queries. I'm not sure hehe

Your feedback is highly appreciated 😊😊😊

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

The challenge that I encountered from this challenge are the sizing of the max-inline-size of the card and the spacing when the card is in a desktop view by doing a trial and error of the values I was able to overcome this challenge.

I'm not sure if it's efficient or a good thing to do a trial and error on a value if I'm working on a real-world project. Do you think I should know the calculation of the sizes and spacing without doing a trial and error?

Let me know your thoughts 🧐🧐🧐

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

For this challenge I didn't need any help on areas. But Your feedback is highly appreciated 😊😊😊

What are you most proud of, and what would you do differently next time?

I'm most proud of on implementing the counter, counter-reset, counter-increment properties and how I structure the HTML base on the website I research.

If I would do this project again. I would do the margin-top and margin-bottom spacing of the card differently.

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

The challenge that I have encountered while doing this project is styling the unordered list dot and ordered list dot which is the preparation section, ingredients section and instructions section.

I overcome this challenge by researching on different recipe websites. Chrome developer tools came in handy to overcome this challenge what I did is inspect the HTML of different recipe websites. This approach give me idea on how I will structure or style my elements.

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

I'm not unsure if setting a margin-block-start and margin-block-end on the card for spacing it is a good approach.

   
        ...article content recipe
   

@media only screen and (min-width: 64rem) {
  main {
    margin-block: 8rem;
  }

What are you most proud of, and what would you do differently next time?

I'm most proud of how ease I can do the project and time.

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

For this project I didn't encounter any tough challenges.

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

Your feedback will be much appreciated ! !

What are you most proud of, and what would you do differently next time?

I'm proud of how I can think the HTML layout and CSS by looking at the design, The thing that I will do differently next time is to add some animation on the card or a interaction of the card is more better.

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

For this challenge I didn't encounter any challenges.

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

I would like to have an opinion for this code

  HTML & CSS foundations

As you can see I added an link to the heading. I'm not sure this is the best practices on adding a link to the anchor element

Your feedback will be appreciated.

What are you most proud of, and what would you do differently next time?

I'm most proud that it only takes 1 hour to complete this challenge.

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

I didn't encounter any challenges.

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

None

Hello Mentors

Checkout my solution for this challenge!

Your feedback is greatly valued.

Hi Mentors

I'm also planning on turning this as my personal portfolio. Do you know any website that I can use to edit my own image like with the profile image provided by the challenge? UI/UX wise, Is it ok to remove the image if I didn't format my own image as with the profile image.

Your feedback will be truly appreciated

Hey Mentors

I just submitted a solution for this challenge, This is my first time implementing dark mode, I found it difficult I think it's because I'm using a SASS maybe I should try it in a CSS.

Your feedback will be very helpful.

Hey Mentors!

This challenge is pushing me to the limit. I've learned how to build an accessible disclosure during this process, and your feedback will be greatly appreciated.

Hi Everyone,

Your feedback will help me develop my frontend skills !

I did this challenge again, I want to learn more on setting the width and max-width to a specific element.

• I am unsure if the width and max-width that I set is correct?

This is my first challenge after a 7 day break on coding. Let me know your thoughts on this challenge ! :)

The difficulties that I found on building this project is creating a mobile menu, I'm not sure if I did it right. Your feedback will definitely help me on improving on how to approach or create a mobile menu.

My questions about this project is the aria-expanded on my hamburger button, What is the correct usage of this? Do I need to turn it onto true, If so how will I do it using JavaScript

Your Feedback will be great ! ! !

How you approach on styling the box shadow?

Your feedback will great ! ! !

Which areas of your code are you unsure of?

• The areas of the code that I'm unsure of is where the value of the tip amount and total amount change.

Please give me some feedback so I can improve this project. Thank you

Your feedback is highly appreciated!

What is the best practices on validating email, Should I set novalidate to the form and validate it through JavaScript or should I not set the novalidate to the form and let the user agent validate my email input ?

• I have a question on the best practices, Should I implement more DRY in my code. I think it's kind of cluttered and messy hehe. This is my first time taking the challenge with react.js

Your feedback will be much appreciated !

What is your feedback?

• The difficulties I found on building this projects are: implementing the curve background svg on the hero section and implementing the invalid text

• I'm unsure on how I implemented the background svg and invalid text

• What are the best approach for background svg and input fields active states?

I think my is code cluttered and confusing !, This is my first JavaScript challenge, Please give me some feedback. Thank you!

Your feedback will help me to improve