add diagram

docs/tree/index.md

@@ -10,3 +10,34 @@ Murph manages contents this way:
 	- the routing
 	- some attributes
 	- a sitemap configuration
+
+## Diagram
+
+``` mermaid
+%%{
+  init: {
+    "theme": "dark",
+    "flowchart": {
+      "curve": "cardinal"
+    }
+  }
+}%%
+
+graph TB
+  N1[Navigation 1] --> M1[Menu 1];
+  N2[Navigation ...];
+  NX[Navigation n];
+
+  N1 --> M2[Menu ...];
+  N1 --> M3[Menu n];
+
+  M1 --> MN1[Node 1]
+  M1 --> MN2[Node ...]
+  M1 --> MN3[Node n]
+
+  MN1 --> P1[Page]
+
+  P1 --> B1[Block 1]
+  P1 --> B2[Block 2]
+  P1 --> BN[Block n]
+```

mkdocs.yml

@@ -56,7 +56,11 @@ markdown_extensions:
   - pymdownx.emoji:
       emoji_index: !!python/name:materialx.emoji.twemoji
       emoji_generator: !!python/name:materialx.emoji.to_svg
-
+  - pymdownx.superfences:
+      custom_fences:
+        - name: mermaid
+          class: mermaid
+          format: !!python/name:pymdownx.superfences.fence_code_format
 nav:
   - Overview:
     - Overview: index.md