Responsive Product Preview Card Using Flexbox and Media Queries

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

I think I'm most proud of the fact that I figured out how to use two different pictures using the picture element. Or no, I'm probably most proud of the fact that I tried a mobile-first workflow and did great. It was like something just clicked and I felt like i temporarily knew what I was doing and where to start and how to move forward. It was just an amazing feeling. Especially since I've been in a place where I've just felt like I don't understand a thing and I'll never be good enough and well you know...

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

The first challenge was actually how to use two different pictures. I think I tried a gazillion different ways before even getting it to work. It was probably not as complicated as I made it out to be, but I just couldn't get it working. I spent a couple of hours on it and ended up using the picture element. Me having set a max-with on the card complicated things a bit but when I increased the max-width on the card in the media query it worked just fine.

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

I'd like to know if using the picture element was the best way to go or if there are other (more suitable) solutions? How did you do it?

And then just general feedback I guess, anything you can tell me that can help me develop is much appreciated.