[Suggestion] Use embedded codepen to show example codes in vuepress

[tychenjiajun]

Is your feature request related to a problem? Please describe. The vuepress doc now only shows examples but no codes. Users can only get example code from the vuepress source code. Although some example codes are shown in markdown in the component folder, I find it hard to write because I have to maually formatting code every time I try to update them.

Describe the solution you'd like Implement a customized component <m-codepen> in vuepress with an embedded codepen in it. Place <m-codepen> in the docs to show the example codes and provide a playground for users.

Additional context Vuedoc may also be helpful in writing docs.

[matsp]

@tychenjiajun

You are right. Example code and rendered output side by side would be great. Let's collect ideas in this issue to evaluate what solutions are possible - maybe also by looking at other projects.

[tychenjiajun]

@matsp Personally, I'm in favour of how Buefy documents their components.

[matsp]

@tychenjiajun Yeah thats a nice example of documenation!