Admonitions
In addition to the basic Markdown syntax, we use remark-admonitions alongside MDX to add support for admonitions. Admonitions are wrapped by a set of 3 colons.
Example:
:::note
Some **content** with _markdown_ `syntax`. Check [this `api`](#).
:::
:::tip
Some **content** with _markdown_ `syntax`. Check [this `api`](#).
:::
:::info
Some **content** with _markdown_ `syntax`. Check [this `api`](#).
:::
:::caution
Some **content** with _markdown_ `syntax`. Check [this `api`](#).
:::
:::danger
Some **content** with _markdown_ `syntax`. Check [this `api`](#).
:::
note
Some content with markdown syntax
. Check this api
.
tip
Some content with markdown syntax
. Check this api
.
info
Some content with markdown syntax
. Check this api
.
caution
Some content with markdown syntax
. Check this api
.
danger
Some content with markdown syntax
. Check this api
.
Specifying title#
You may also specify an optional title
:::note Your Title
Some **content** with _markdown_ `syntax`.
:::
Your Title
Some content with markdown syntax
.
Admonitions with MDX#
You can use MDX inside admonitions too!
import Tabs from '@theme/Tabs';
import TabItem from '@theme/TabItem';
:::tip Use tabs in admonitions
<Tabs defaultValue="apple" values={[ {label: 'Apple', value: 'apple'}, {label: 'Orange', value: 'orange'}, {label: 'Banana', value: 'banana'}, ]}> <TabItem value="apple">This is an apple π</TabItem> <TabItem value="orange">This is an orange π</TabItem> <TabItem value="banana">This is a banana π</TabItem></Tabs>
:::
Use tabs in admonitions
- Apple
- Orange
- Banana
This is an apple π
This is an orange π
This is a banana π