From 6e04b1bab644045398b213900b60bf1ac1c0272d Mon Sep 17 00:00:00 2001 From: Fuwn Date: Tue, 6 Apr 2021 20:11:26 -0700 Subject: major: Furnish repository --- docs/tutorial/markdown-features.mdx.dev | 128 ++++++++++++++++++++++++++++++++ 1 file changed, 128 insertions(+) create mode 100644 docs/tutorial/markdown-features.mdx.dev (limited to 'docs/tutorial/markdown-features.mdx.dev') diff --git a/docs/tutorial/markdown-features.mdx.dev b/docs/tutorial/markdown-features.mdx.dev new file mode 100644 index 0000000..622391d --- /dev/null +++ b/docs/tutorial/markdown-features.mdx.dev @@ -0,0 +1,128 @@ +--- +title: Markdown Features +--- + +Docusaurus supports the [Markdown](https://daringfireball.net/projects/markdown/syntax) syntax and has some additional features. + +## Front Matter + +Markdown documents can have associated metadata at the top called [Front Matter](https://jekyllrb.com/docs/front-matter/): + +```md +--- +id: my-doc +title: My document title +description: My document description +sidebar_label: My doc +--- + +Markdown content +``` + +## Markdown links + +Regular Markdown links are supported using url paths or relative file paths. + +```md +Let's see how to [Create a page](/create-a-page). +``` + +```md +Let's see how to [Create a page](./create-a-page.md). +``` + +Let's see how to [Create a page](./create-a-page.md). + +## Markdown images + +Regular Markdown images are supported. + +Add an image at `static/img/docusaurus.png` and use this Markdown declaration: + +```md +![Docusaurus logo](/img/docusaurus.png) +``` + +![Docusaurus logo](/img/docusaurus.png) + +## Code Blocks + +Markdown code blocks are supported with Syntax highlighting. + + ```jsx title="src/components/HelloDocusaurus.js" + function HelloDocusaurus() { + return ( +

Hello, Docusaurus!

+ ) + } + ``` + +```jsx title="src/components/HelloDocusaurus.js" +function HelloDocusaurus() { + return

Hello, Docusaurus!

; +} +``` + +## Admonitions + +Docusaurus has a special syntax to create admonitions and callouts: + + :::tip My tip + + Use this awesome feature option + + ::: + + :::danger Take care + + This action is dangerous + + ::: + +:::tip My tip + +Use this awesome feature option + +::: + +:::danger Take care + +This action is dangerous + +::: + +## React components + +Thanks to [MDX](https://mdxjs.com/), you can make your doc more interactive and use React components inside Markdown: + +```jsx +export const Highlight = ({children, color}) => ( + + {children} + +); + +Docusaurus green and Facebook blue are my favorite colors. +``` + +export const Highlight = ({children, color}) => ( + + {children} + +); + +Docusaurus green and + Facebook blue + are my favorite colors. -- cgit v1.2.3