added mid-level content

docs/dev/02-intermediaire/markdown.md

@@ -0,0 +1,137 @@
+# Intro au markdown
+
+Le langage markdown est une manière d'écrire du `html` simplifiée. Un fichier markdown seul ne sera pas compris par un navigateur. Il est indispensable de le " compiler " afin de le rendre lisible dans un navigateur.
+
+## Titres
+
+Pour écrire des titres, on préfixe avec des `#`. Autant de `#` que de niveau de titre.
+Exemple: `## h2`, `### h3`
+
+## Listes
+
+### Ordonnées
+
+1. une
+2. liste
+3. ordonnée
+
+:::details Code source
+
+```md
+1. une
+2. liste
+3. ordonnée
+
+équivalen à
+
+1. une
+1. liste
+1. ordonnée
+```
+
+:::
+
+### Désordonnées
+
+- une
+- liste
+  1. liste
+  1. imbriquée
+- désordonnée
+
+:::details Code source
+
+```md
+- une
+- liste
+  1. liste
+  1. imbriquée
+- désordonnée
+```
+
+:::
+
+### Checkbox
+
+- [ ] à faire
+- [x] urgent
+
+:::warning Attention
+N'est pas supporté partout, comme ici par exemple 😬
+:::
+
+## Code
+
+Ligne de code: entourer avec des "backticks" `code`
+
+:::details Code source
+
+```md
+`code`
+```
+
+:::
+
+Bloc de code:
+
+```css
+body {
+  font-size: 1rem;
+}
+```
+
+:::details Code source
+
+````md
+```css
+body {
+  font-size: 1rem;
+}
+```
+````
+
+:::
+
+## Liens
+
+`[texte du lien](https://cible-du-lien.fr)`
+
+Exemple: [nardu.in](https://www.nardu.in)
+
+## Images
+
+`![](CIBLE_IMAGE)`
+
+![](https://picsum.photos/200/200)
+
+## Mise en forme
+
+On peut écrire du texte en gras ou en italique grâce aux `*` et/ou au `_`.
+
+### Gras
+
+Du texte **en gras.**
+
+:::details Code source
+
+```md
+Du texte **en gras.**
+```
+
+:::
+
+### Italique
+
+Du texte _en italique._
+
+:::details Code source
+
+```md
+Du texte _en italique._
+```
+
+:::
+
+## Référence
+
+[Documentation sur le markdown.](https://www.markdownguide.org/cheat-sheet/)