{"componentChunkName":"component---content-getting-started-markdown-syntax-md","path":"/getting-started/markdown-syntax","result":{"pageContext":{"rootAbsolutePath":"/home/runner/work/awesome-design-system-100/awesome-design-system-100","slug":"getting-started/markdown-syntax","rawBody":"---\ntitle: Markdown Syntax\n---\n\n# Header 1\n\n## Header 2\n\n### Haeder 3\n\n#### Header 4\n\n##### Header 5\n\n###### Header 6\n\n## Lists\n\n- Unordered 1\n- Unordered 2\n- Unordered 3\n\n1. Ordered 1\n1. Ordered 2\n1. Ordered 3\n\n- Nested 1\n - Nested 1.1\n - Nested 1.2\n- Nested 2\n\n
\n{`\n${'```'}html\n\n${'```'}\n`}\n
\n\n### Live example\n\nThe code in the examples can be rendered so that they can be living!\n\n```html live\n Label\n```\n\nMerely add `live` attribute next to the language.\n\n\n{`\n${'```'}html live\n Label\n${'```'}\n`}\n
\n\n### Example without code\n\nOr you can provide a living example of the component but hide its code.\n\n```html live nocode\n Label\n```\n\nThis is done with an additional `nocode` attribute.\n\n\n{`\n${'```'}html live nocode\n Label\n${'```'}\n`}\n
\n\n### React live examples\n\nLive examples work also with the linked React components. You can give a code\nexample and render its preview.\n\n```jsx live\n\n{`\n${'```'}jsx live\nPrimary \n${'```'}\n`}\n
\n\nOr you can choose to hide the code block leaving only the preview.\n\n```jsx live nocode\n\n{`\n${'```'}jsx live nocode\nPrimary \n${'```'}\n`}\n
\n\nAnd the code blocks alone work for React examples as well.\n\n```jsx\n\n{`\n${'```'}jsx\nPrimary \n${'```'}\n`}\n
\n\n## Special blocks\n\n### Do and don't\n\n#### With images\n\n