All solutions

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

I am proud of myself for how far I have come on this journey. It has been a wonderful one.

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

I didn't encounter any challenge.

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

I am proud of myself for completing this challenge.

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

I didn't encounter any challenges.

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

Proud of myself for having to attempt this challenge even though the skill level was set to intermediate.

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

Just figuring out the exact size of the mobile app. Since I wasn't working with detailed and exact measurements, I was eyeballing it and that definitely was not the best.

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

I am most proud of myself for completing this challenge. I had to go upskill my HTML and CSS knowledge, but it was definitely worth it.

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

I think the challenge I encountered was how the image was to stack on the stats component in the mobile view, but I was able to do that using flex direction: column-reverse.

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

I'm proud that I got to finish this challenge in a personal record time. I think I need to pay more attention to media queries and I will.

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

I am most proud of myself for completing this challenge. I don't think there's anything I would do differently next time unless if there's a more efficient way to implement a solution then I'm open to suggestions.

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

I encountered the challenge of displaying the cyan color overlay when a user hovers on the image. I was able to overcome this challenge by tweaking my CSS codes a little bit. The entire process is in the readme file in the GitHub repo.

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

Proud of myself for attempting this challenge, even though I wasn't able to implement the data.json file but I still got something.

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

I am most proud to learn a new technique which is putting the button tags inside of the hyperlink tags (a tags) and then using width and height properties to give it some size.

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

So at first glance, I already knew that I was going to tackle this challenge using Flexbox which I did and it was quite simple. Although, I ran into a bit of a challenge when I initally had put the a tags (hyperlinks tags) inside of button tags. It worked quite alright that way but the hover effect in this method will only change the color of text inside the button when you hover around the link itself on the button and not when you hover around the entire button. I then figured out that if I instead put the button tags inside of a tags, it works perfectly and even the button becomes clickable unlike how it was initially. And also the styling of the buttons became different for me because I was used to using padding to give it a width and a height but I figured using the width and height properties directly is far much better and neater. Think that does it. I'll be available for any clarification of sorts. Thank you and Happy Coding!

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

I'm proud of how familiar I was with the HTML and CSS environment and properties. Thanks to every helpful comment on my solutions. You guys are the best.

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

I encountered a challenge of placing the nutrition content at the bottom of the page side by side. I ended up using CSS grid to solve the problem. Go look it up in my codes. I am open to helpful tips and tricks.

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

I need help with writing semantic HTML with easy accessibility.

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

It was a pretty easy challenge.

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

I didn't encounter any challenge.

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

I am most proud of myself for completing and executing this challenge. Proud of how far I've come in this web development journey. Can't wait to face more challenges.

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

The major challenge I encountered was using CSS Grid. I mixed up the execution part of the grid, I couldn't figure out if the widths of the cards should be determined by the grid itself or if I was supposed to specify the widths. In any case when you go through my code, you'll find out that the widths of the cards were determined by the grid. I'm open to more suggestions and tips and tricks on how to navigate my way with using CSS grid.

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

I think I might need some help positioning the big quotation icon at the background of the first card. I totally forgot about it lol.

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

I'm proud of myself for being able to complete this challenge. I am most proud of being able to implement the flexbox to conquer this challenge.

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

First challenge I encountered was deciding between the which technique to use between the flexbox or grid. Second challenge, I tried flexbox first, didn't get it working because I couldn't get the left and right cards to come down into the middle of the page. lol I then decided to use grid and it was even worse lol. Well, as you can see from my solution, I made it work with flexbox.

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

I think I'm good for now. Thank you to AlexArcher for your help these past few weeks. Thank you to others who made one input or the other, you make me better.

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

I encountered the challenge of adapting it for mobile screens. I worked on my HTML code by removing the header, paragraphs tags from the div containers I initially put them in and styled them accordingly.

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

I'm proud of the fact that I attempted this challenge, and I learnt so much while at it.

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

My only challenge was making the website responsive for mobile screens. It prove to be very difficult for me, sadly.

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

I would like help with the CSS to make the website responsive for mobile screens. I don't know where I got it wrong, it could be from the HTML code or the CSS but I know something is not right.

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

Firstly, I am most proud of my ability to pull it off. Lol, thinking about where I started a few weeks ago with zero knowledge of anything concerning frontend development, I must say that I am proud of myself.

Secondly, I would try the mobile first approach next time and wouldn't beat myself up too hard when I can't seem to get something working.

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

I encountered a challenge of moving the QR code component to the center of the screen for the mobile viewport, but I overcame it when I referred back to previous tutorials I had taken on the flexbox technique I used.

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

Basically, just making the codes a bit shorter and more pro-like, if that makes sense, lol.