huge upgrade to theme and pagefind search bar.

themes/hugo-book.backup/exampleSite/content.en/docs/shortcodes/mermaid.md

@@ -0,0 +1,186 @@
+# Mermaid Chart
+
+[MermaidJS](https://mermaid-js.github.io/) is library for generating svg charts and diagrams from text.
+
+{{% hint info %}}
+**Override Mermaid initialization config**  
+To override the [initialization config](https://mermaid-js.github.io/mermaid/#/Setup) for Mermaid,
+create a `mermaid.json` file in your `assets` folder!
+{{% /hint %}}
+
+## Example
+
+{{% columns %}}
+- ````tpl
+  ```mermaid
+  stateDiagram-v2
+      State1: The state with a note
+      note right of State1
+          Important information! You can write
+          notes.
+      end note
+      State1 --> State2
+      note left of State2 : This is the note to the left.
+  ```
+  ````
+
+- ```mermaid
+  stateDiagram-v2
+      State1: The state with a note
+      note right of State1
+          Important information! You can write
+          notes.
+      end note
+      State1 --> State2
+      note left of State2 : This is the note to the left.
+  ```
+{{% /columns %}}
+
+{{% columns %}}
+- ```tpl
+  {{</* mermaid [class="..."] >}}
+  stateDiagram-v2
+      State1: The state with a note
+      note right of State1
+          Important information! You can write
+          notes.
+      end note
+      State1 --> State2
+      note left of State2 : This is the note to the left.
+  {{< /mermaid */>}}
+  ```
+
+- {{< mermaid >}}
+  stateDiagram-v2
+      State1: The state with a note
+      note right of State1
+          Important information! You can write
+          notes.
+      end note
+      State1 --> State2
+      note left of State2 : This is the note to the left.
+  {{< /mermaid >}}
+{{% /columns %}}
+
+## Diagrams
+Explore more diagrams and syntax on Mermaid [documentation page](https://mermaid.js.org/syntax/flowchart.html).
+
+{{% columns %}}
+
+```mermaid
+stateDiagram-v2
+    State1: The state with a note
+    note right of State1
+        Important information! You can write
+        notes.
+    end note
+    State1 --> State2
+    note left of State2 : This is the note to the left.
+```
+
+```mermaid
+sequenceDiagram
+    Alice->>John: Hello John, how are you?
+    John-->>Alice: Great!
+    Alice-)John: See you later!
+```
+
+```mermaid
+---
+title: Animal example
+---
+classDiagram
+    note "From Duck till Zebra"
+    Animal <|-- Duck
+    note for Duck "can fly\ncan swim\ncan dive\ncan help in debugging"
+    Animal <|-- Fish
+    Animal <|-- Zebra
+    Animal : +int age
+    Animal : +String gender
+    Animal: +isMammal()
+    Animal: +mate()
+    class Duck{
+        +String beakColor
+        +swim()
+        +quack()
+    }
+    class Fish{
+        -int sizeInFeet
+        -canEat()
+    }
+    class Zebra{
+        +bool is_wild
+        +run()
+    }
+```
+
+```mermaid
+---
+title: Simple sample
+---
+stateDiagram-v2
+    [*] --> Still
+    Still --> [*]
+
+    Still --> Moving
+    Moving --> Still
+    Moving --> Crash
+    Crash --> [*]
+```
+
+<--->
+
+```mermaid
+---
+title: Example Git diagram
+---
+gitGraph
+   commit
+   commit
+   branch develop
+   checkout develop
+   commit
+   commit
+   checkout main
+   merge develop
+   commit
+   commit
+```
+
+```mermaid
+gantt
+    title A Gantt Diagram
+    dateFormat YYYY-MM-DD
+    section Section
+        A task          :a1, 2014-01-01, 30d
+        Another task    :after a1, 20d
+    section Another
+        Task in Another :2014-01-12, 12d
+        another task    :24d
+```
+
+```mermaid
+pie title Pets adopted by volunteers
+    "Dogs" : 386
+    "Cats" : 85
+    "Rats" : 15
+```
+
+```mermaid
+quadrantChart
+    title Reach and engagement of campaigns
+    x-axis Low Reach --> High Reach
+    y-axis Low Engagement --> High Engagement
+    quadrant-1 We should expand
+    quadrant-2 Need to promote
+    quadrant-3 Re-evaluate
+    quadrant-4 May be improved
+    Campaign A: [0.3, 0.6]
+    Campaign B: [0.45, 0.23]
+    Campaign C: [0.57, 0.69]
+    Campaign D: [0.78, 0.34]
+    Campaign E: [0.40, 0.34]
+    Campaign F: [0.35, 0.78]
+```
+
+{{% /columns %}}