Product preview card component with SASS and FLEXBOX.

Nice and minimalistic code. But from my point of view a bit too reduced.

I miss the responsive behavior for older mobiles down to 320px. On this width the layout doesn't work correctly anymore.

perfume you should’n do with spaces, but with letter-spacing: 0.5.rem.

From my point of view, the layout is too static, but I don't know if that's intentional.

I would use mobile first approach. The main code mobile and for bigger screen @media (min-width: xxx).

In mobile version the image will be squeezed, if you squish the browser, because you defined a height at .main. If you view the page in landscape mode, content will be cut off. Scrolling would be the correct behavior.

Translated with www.DeepL.com/Translator (free version)

This is almost exactly the same as the original! How'd you get it so close to it? I struggled with getting the image to the exact size.