');}.md-tag--atlas{--md-tag-icon:url('data:image/svg+xml;charset=utf-8,');}.md-tag--balai{--md-tag-icon:url('data:image/svg+xml;charset=utf-8,');}.md-tag--brick{--md-tag-icon:url('data:image/svg+xml;charset=utf-8,');}.md-tag--cerveau{--md-tag-icon:url('data:image/svg+xml;charset=utf-8,');}.md-tag--citrouille{--md-tag-icon:url('data:image/svg+xml;charset=utf-8,');}.md-tag--code{--md-tag-icon:url('data:image/svg+xml;charset=utf-8,');}.md-tag--commentaires{--md-tag-icon:url('data:image/svg+xml;charset=utf-8,');}.md-tag--conference{--md-tag-icon:url('data:image/svg+xml;charset=utf-8,');}.md-tag--database{--md-tag-icon:url('data:image/svg+xml;charset=utf-8,');}.md-tag{--md-tag-icon:url('data:image/svg+xml;charset=utf-8,');}.md-tag--drone{--md-tag-icon:url('data:image/svg+xml;charset=utf-8,');}.md-tag--facebook{--md-tag-icon:url('data:image/svg+xml;charset=utf-8,');}.md-tag--feuille{--md-tag-icon:url('data:image/svg+xml;charset=utf-8,');}.md-tag--geoloupe{--md-tag-icon:url('data:image/svg+xml;charset=utf-8,');}.md-tag--git{--md-tag-icon:url('data:image/svg+xml;charset=utf-8,');}.md-tag--globe{--md-tag-icon:url('data:image/svg+xml;charset=utf-8,');}.md-tag--google{--md-tag-icon:url('data:image/svg+xml;charset=utf-8,');}.md-tag--html{--md-tag-icon:url('data:image/svg+xml;charset=utf-8,');}.md-tag--institution{--md-tag-icon:url('data:image/svg+xml;charset=utf-8,');}.md-tag--js{--md-tag-icon:url('data:image/svg+xml;charset=utf-8,');}.md-tag--manette{--md-tag-icon:url('data:image/svg+xml;charset=utf-8,');}.md-tag--markdown{--md-tag-icon:url('data:image/svg+xml;charset=utf-8,');}.md-tag--masques{--md-tag-icon:url('data:image/svg+xml;charset=utf-8,');}.md-tag--meridiens{--md-tag-icon:url('data:image/svg+xml;charset=utf-8,');}.md-tag--oeuf{--md-tag-icon:url('data:image/svg+xml;charset=utf-8,');}.md-tag--open{--md-tag-icon:url('data:image/svg+xml;charset=utf-8,');}.md-tag--opensource{--md-tag-icon:url('data:image/svg+xml;charset=utf-8,');}.md-tag--pingouin{--md-tag-icon:url('data:image/svg+xml;charset=utf-8,');}.md-tag--python{--md-tag-icon:url('data:image/svg+xml;charset=utf-8,');}.md-tag--roue{--md-tag-icon:url('data:image/svg+xml;charset=utf-8,');}.md-tag--route{--md-tag-icon:url('data:image/svg+xml;charset=utf-8,');}.md-tag--rstats{--md-tag-icon:url('data:image/svg+xml;charset=utf-8,');}.md-tag--satellite{--md-tag-icon:url('data:image/svg+xml;charset=utf-8,');}.md-tag--streetview{--md-tag-icon:url('data:image/svg+xml;charset=utf-8,');}.md-tag--telephone{--md-tag-icon:url('data:image/svg+xml;charset=utf-8,');}.md-tag--tente{--md-tag-icon:url('data:image/svg+xml;charset=utf-8,');}.md-tag--ubuntu{--md-tag-icon:url('data:image/svg+xml;charset=utf-8,');}.md-tag--wikipedia{--md-tag-icon:url('data:image/svg+xml;charset=utf-8,');}.md-tag--windows{--md-tag-icon:url('data:image/svg+xml;charset=utf-8,');}
Insérer des diagrammes
Le site intègre la bibliothèque MermaidJS qui permet de générer des diagrammes en utilisant une extension de la syntaxe Markdown.
On utilise l'intégration dans le thème Material for Mkdocs.
Syntaxe
Cela consiste en créant une balise de code pointant sur le langage mermaid
, dans laquelle on insère notre syntaxe MermaidJS.
Tip
Pour se faciliter les choses, il est conseillé d'utiliser l'éditeur en ligne pour préparer son diagramme.
Exemple 1
1
2
3
4
5
6
7
8
9
10
11
12 | ```mermaid
flowchart TD;
Z[master]-->A[Création d'une branche]-->B(Pull Request);
C[Contributeur 1]-->B;
D[Contributrice 2]-->B;
E[Contributeur n]-->B;
B-->F[Merge dans la branche principale];
F-->G[Conversion en HTML];
G-->H[Déploiement sur GitHub Pages];
H-->Twitter;
H-->LinkedIn;
```
|
Rendu 1
flowchart TD;
Z[master]-->A[Création d'une branche]-->B(Pull Request);
C[Contributeur 1]-->B;
D[Contributrice 2]-->B;
E[Contributeur n]-->B;
B-->F[Merge dans la branche principale];
F-->G[Conversion en HTML];
G-->H[Déploiement sur GitHub Pages];
H-->Twitter;
H-->LinkedIn;
Exemple 2
| ```mermaid
flowchart LR
A[Start] --> B{Error?};
B -->|Yes| C[Hmm...];
C --> D[Debug];
D --> B;
B ---->|No| E[Yay!];
```
|
Rendu 2
flowchart LR
A[Start] --> B{Error?};
B -->|Yes| C[Hmm...];
C --> D[Debug];
D --> B;
B ---->|No| E[Yay!];