All solutions

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

I needed to practice CSS Grid so this was a fun challenge.

If I was to start over again, I would definitely do mobile first. Because I did the grid layout for the desktop first, I had to manually reset each card position to stack them vertically on a single column. If I started mobile first, they would already be stacked in a column because of the display grid. I would've written less CSS.

Next challenge that I need to use CSS Grid, I might try and practice grid template areas.

Any feedback is appreciated, thank you.

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

I am not happy with the responsiveness between 375px - 1085px (my media query breakpoint). I am probably going to tweak the project and make it so it looks better at these screen widths, before switching to the mobile version at 375px.

I am also not happy with the inline padding (left and right) when making the viewport smaller, this start to get really cramped together.

I also have a question about the hero image, I hardcoded the width so it is the same size as the design but there is a drawback, when my viewport width gets smaller, the image does not shrink (not responsive), should I have used percentage instead? But then how do I get it the exact same size as the figma design (696px width)?