docs: use autogenerated pages for try out

[layershifter]

Currently our https://griffel.js.org/try-it-out/ is powered by hash based based on snippets collected in Playground component:

griffel/apps/website/src/components/Playground/index.tsx

Line 9 in 62cf39c

const ctx = require.context('./code/templates', false, /\.js$/);

Ideally we should have:

• a real page for every example i.e. /try-it-out/margin
  • remove require.resolve() in Playground
• pass source as a string Playground component

  <Playground source={props.source} />

• it be part of docusaurus start i.e. no other commands are required to update these pages

Ideally, we are looking for something like getStaticPaths() in Next.js, but in docusaurus 🙃