feat: add components showcase page

[Matgorn]

Overview:

Temporarily page is only available with following url - https://deploy-preview-75--selleo-designsystem.netlify.app/components/

57 - As it is said in the ticket -

"For now the bg images of cards can be screenshots from figma and we will replace them later. Grid should be responsible ranging from 1 to 4 (mobile-desktop) cards per row"

I used Info Boxes as placeholder images for now, just to keep ratio fixed. All page styles is just a base grid which is going to be adjusted according to the designer's recommendations.

In my opinion current Layout main section is too small to display 4 cards per row. However, when it comes to design, I fully rely on @michalgren

Preview

Current view

Max 3 cards per row proposition

[netlify[bot]]

✅ Deploy Preview for selleo-designsystem ready!

Name	Link
🔨 Latest commit	9fa4d9fe47598cbec469d957b7f77f139eb56cc6
🔍 Latest deploy log	https://app.netlify.com/sites/selleo-designsystem/deploys/642570ae3e19a70008c01449
😎 Deploy Preview	https://deploy-preview-75--selleo-designsystem.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site settings.

[michalgren]

@Matgorn Yes, we could use 3 cards per row. In the future, we might want to redesign a bit this previews. For now, go for 3 per row

[PoslinskiNet]

Can we make it somehow dynamic, so it relays on the implementation (i.e. first component in the kind), so we don't have to update images later on?

How much time approximately it could take?

[k1eu]

@PoslinskiNet we could but this would be docs integration heavy I'd skip it for now since I'm trying not to get hooked to much into Astro if we wanted to switch to other providers. I'd definitely update the images though to at least roughly show what's inside like this:

[PoslinskiNet]

@k1eu let's keep it as you said.

[PoslinskiNet]

I would consider 3 or even 2 components per row since reading with such a small preview is complex.

I would change the description or remove it altogether since the number is not matching the actual amount on the list. Also, I don't see a great value in such a description, since One picture is worth a thousand words.

[PoslinskiNet]

@DawidHaratyk ☝🏼

[DawidHaratyk]

I would consider 3 or even 2 components per row since reading with such a small preview is complex.

I would change the description or remove it altogether since the number is not matching the actual amount on the list. Also, I don't see a great value in such a description, since One picture is worth a thousand words.

@PoslinskiNet Right, I've decided to put 3 per row, I think it's the most accurate

[PoslinskiNet]

@DawidHaratyk It's much better now 👍🏼

[PoslinskiNet]

@k1eu review please 🙏🏼

[PoslinskiNet]

@Matgorn Also, change the title of the PR :).