Markdown syntax

Short markdown tutorial

Typographie

Title

# Titre 1
## Titre 2: First level
### Titre 3 : second level
#### Titre 4 : not in the menu

Formatting

normal text 
**bold text**
*italic text*
~~The world is flat.~~

normal text

bold text

italic text

The world is flat.


Citation

> Citation 

List

  1. First item
  2. Second item
  3. Third item
1. First item
2. Second item
3. Third item

  • First item
  • Second item
  • Third item
    • indented item
- First item
- Second item
- Third item
    - indented item

arXiv

[arXiv](https://www.arxiv.org)

Components

<Alert />

Check out an info alert with code and a link.
Check out a success alert with code and a link.
Check out a warning alert with code and a link.
Check out a danger alert with code and a link.
Code
::alert{type="info"}
Check out an **info** alert with `code` and a [link](/).
::
::alert{type="success"}
Check out a **success** alert with `code` and a [link](/).
::
::alert{type="warning"}
Check out a **warning** alert with `code` and a [link](/).
::
::alert{type="danger"}
Check out a **danger** alert with `code` and a [link](/).
::

<Badge />

<Badge /> support same types as <Alert />.

v1.2DeprecatedNot found!
Code
:badge[v1.2]

:badge[Deprecated]{type="warning"}

::badge{type="danger"}
Not found!
::

<BlockHero />

Documentation

Type your text here

Bash
$install python
Click to copy
Code
::block-hero
 ---
 cta:
   - Get started
   - /get-started
 secondary:
   - Open on GitHub →
   - https://github.com/
 snippet: install python
 ---
 #title
 Documentation

 #description
 Type your text here
::
Code
:button-link[LINK]{icon="IconStackBlitz" href="https://github.com/" blank}

<Callout />

<Callout /> support same types as <Alert />.

This is a callout! Click me to open.

This is a callout! Click me to open.

Code
::callout
#summary
This is a callout! Click me to open.
#content
This is the content of the callout.
::
 
::callout{type="warning"}
#summary
This is a callout! Click me to open.
#content
This is the content of the callout.
::

<Card />

Topic 1.

Describe your topic here

Code
 ::card{icon="logos:nuxt-icon"}
 #title
 Topic 1.
 #description
 Describe your topic here
 ::

<CardGrid />

What is this ?

Topic 1.

Description 1. We have written a starting package which lists the first steps during your first week here.

Topic 2.

Description 2. We have written a starting package which lists the first steps during your first week here.

Topic 3.

Description 3. We have written a starting package which lists the first steps during your first week here.

Code
::card-grid
#title
What is this ?
#root
:ellipsis
#default
  ::card
  #title
  Topic 1.
  #description
  Description 1.
  We have written a starting package which lists the first steps during your first week here.
  ::
  ::card
  #title
  Topic 2.
  #description
  Description 2.
  We have written a starting package which lists the first steps during your first week here.
  ::
  ::card
  #title
  Topic 3.
  #description
  Description 3.
  We have written a starting package which lists the first steps during your first week here.
  ::
::

<CodeGroup />

This component uses slots to create a tab panel of your code examples or preview.

Yarn
yarn add docus
NPM
npm install docus
Code
::code-group
  ```bash [Yarn]
  yarn add docus
  ```
  ```bash [NPM]
  npm install docus
  ```
::
<CodeBlock />
To be used inside a <CodeGroup /> component to display a preview of some rendered code.
Hello World!
Code
/* Added as a child of `<CodeGroup />` */
::code-block{label="Preview" preview}
  ::badge
  Hello World!
  ::
::

::

<CopyButton />

Code
:copy-button{content="hey!"}

<Icon />

Icon component gives you access to all icons from icones.js.org.

Code
:icon{name="streamline:ecology-science-planet-solar-system-ring-planet-saturn-space-astronomy"}
:icon{name="academicons:arxiv"}
:icon{name="academicons:google-scholar"}

<List with style/>

  • Important
  • Always
  • Amazing
  • Congrats
  • Do you know?
  • You can also do this
  • Be careful
  • Use with precautions
  • Drinking too much
  • Driving drunk
Code
::list{type="primary"}
- **Important**
- Always
::
::list{type="success"}
- Amazing
- Congrats
::
::list{type="info"}
- Do you know?
- You can also do this
::
::list{type="warning"}
- Be careful
- Use with precautions
::
::list{type="danger"}
- Drinking too much
- Driving drunk
::

<Terminal />

Bash
$install python
Click to copy
Code
:terminal{content="install python"}


<VideoPlayer />

Code
::div
  :video-player{src="https://www.youtube.com/watch?v=df1lwuE46x4"}
::

MD components

Tableau

SyntaxDescription
HeaderTitle
ParagraphText
| Syntax | Description |
| ------ | ----------- |
| Header | Title |
| Paragraph | Text |

Footnote

Here's a sentence with a footnote. 1

Here's a sentence with a footnote. [^1]
[^1]: This is the footnote.

Task list

  • Write the press release
  • Update the website
  • Contact the media
- [x] Write the press release
- [ ] Update the website
- [ ] Contact the media

Footnotes

  1. This is the footnote.