All solutions

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

I feel like my use of Flexbox and media queries improved, and figured out how media queries cascade/override one another based on the screen size satisfying certain conditions. Overall happy with the result here, I could have spent more time tweaking the font spacing/size, element padding and margins, etc to get it more true to the original design but I mostly wanted to work to the spirit of the challenge rather than spend a bunch of time getting it 'perfect'.

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

Not a challenge per se, but I was thinking I maybe could have used the vh and vw values to adjust the size of elements so it would be more dynamically responsive to screen size changes, rather than just hardcoding 3 different sizes. I was thinking maybe clamp() would be the way to go about this, so I could keep the values within a reasonable range, but also not have to hardcode values for multiple media queries.

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

See above, I'm open to suggestions on how to achieve a more dynamic solution for styling responsiveness.

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

This was my first attempt at designing something in CSS based off some guidelines outside of FreeCodeCamp. I'm pretty happy with my design matching the guidelines, but if I was to spend more time on this, I'd make it more responsive, perhaps scale up the size of the component for larger screens more.

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

I'm pretty much a novice, so if there was challenge, I'd say it was deciding which method to use to center the elements (Position, Flexbox, etc). In the end Flexbox seemed the easiest method (for me), but it's really hard as a beginner to not feel like there was a better way to do this. For now though I'm trying to focus on task completion rather than 40 minutes agonizing about whether what I'm doing is best practice or not.

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

I need some help with @media queries, and also advice on the best way to debug/verify they are working as intended. I was simply resizing the window to simulate 'smaller' devices, but I suspect Firefox Dev edition already has tools in there to do this in a better way. I was also unsure of what screen sizes to target.