Include a preview of the components with the documentation website

[frankieroberto]

The documentation website doesn’t currently include any previews of the components.

We should figure out how to add previews - in a similar way to the Design System website or the Ruby components website maybe?

[paulrobertlloyd]

I looked at this when we first put together the website. We could create a component to include an iframe on the documentation page, but that would need additional behaviour to auto-expand to the contained example which is non-trivial. The other, simpler, option is to include an image.

[frankieroberto]

Images sound hard to maintain - although would be better than nothing.

Is it possible to avoid iframes and and just embed the components on the page directly, or is that tricky because reasons?

[paulrobertlloyd]

I’ve just tried to create standalone example pages, which you could link to as an MVP, and show in an iframe later… it certainly wasn’t coming together easily.

That’s partly because this project isn’t setup like the others (yet) – note the lack of homepage illustration, for example. Instead, it renders the various README.md files and creates a website from those. Really it needs a separate docs site created, which may provide more flexibility to create example pages and then embed them in frames, etc.