What are you most proud of, and what would you do differently next time?
made this with love
What challenges did you encounter, and how did you overcome them?
I'm kind of skeptical on doing the mobile first, so I still did desktop first and it took a lot of changes in media query is this ok? please please check my code and recommend a better way thank you!
What specific areas of your project would you like help with?
Honestly, I'm still struggling too with the mobile-first approach. I still find the other way (desktop first) easier for building websites from scratch. I took this exercise as an attempt to get more familiar with it.
On the other hand, consider this: If you stick to the mobile-first approach sometimes you'll be able to save some time and effort (cause desktop versions of websites are not always required nowadays). This is not true if you stick to the desktop-first approach ;)
What are you most proud of, and what would you do differently next time?
I would try defining colours and font-sizes at the start of the document. I feel like my code is all over the place and a bit repetitive.
What challenges did you encounter, and how did you overcome them?
I struggled with margins/padding when displaying image in mobile view.
I overcame this issue with just displaying image twice and adding a display none on second image.
There probably was a much simpler way to do it but I could not figure out how to do it. I do know there is a element we could use but from my understanding that's best to display a different image based on different display viewports.
What specific areas of your project would you like help with?
I would like to know best way to approach styling the image element for desktop/mobile view.
You did a good job, well done ;)
Also remember that part of this work is to be able to replicate exactly the layouts that the designers will give you.
I find it a bit boring too sometimes, but I try to focus on that as an exercise to sharpen my skills :)
Good job. Copying the design in a very detailed way is not as easy as it may look. Remember to check whether the zoom of your page is different than 100% cause sometimes we start copying layouts without realizing that the zoom (and so the look of the page) is different than the real one.
Try to give a look the the use of <h> tags. I'm not sure you should use a <h4> instead of a <h1> or <h2> tag since it's the only title in this page. Great job btw.
Also, in order to optimize your css code you could create a class with flexbox properties and apply it to all the tags that need flexbox instead of repeating every time that piece of code.
