Bento Grid challenge with sass/scss and CSS grids

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

I think I did ok in replicating the design (I haven seen the comparison between my implementation and the reference though, so maybe my optimism is crushed again). I like to lose myself in the details, but in the end there will always be differences.

It was fun to implement the typography here because there were different settings for the various breakpoints (I was using the information from the Figma).

I would like to try to implement this with tailwindcss next time, just to compare the two approaches.

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

Funnily enough the mobile image and the mobile design of the Figma are not exactly the same (the last two cards are in different order). Maybe this has since been fixed, but I don't think this is actually a big deal.

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

I'd appreciate general feedback (or even opinions) about my approach

• Am I using BEM correctly?
• I implemented the individual cards as modifiers, was this a stupid idea? :D
  • I like that the different card-types are in one place and not "spread"
  • Using elements for the different cards "felt" wrong, but would there be any pros to that approach?