Responsive layout using CSS grid

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

I'm proud of completing the project, was very difficult at first. I think what I would do differently for next time is starting with desktop-first design approach rather than mobile, especially if the layout is a complex grid. It's easier to get the complex components of the design out of the way, and then tweak for smaller screens.

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

Originally, I horrendously adjusted the order of elements simply through grid-column-start/end and grid-row-start/end. After reading the W3Schools CSS Grid section, I recalled the grid-area and grid-template-areas properties. It was a lot easier to work with the grid in that way.

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

Sizing the desktop bento-grid so that it wouldn't be too big and require scrolling or zooming out from the user. I do think it's probably somewhere in my bent-grid-container class, and would need to adjust the grid-template-columns section.