Add docsify flexible alerts plugin and update callout syntax

5 files changed, 20 insertions, 6 deletions

diff --git a/docs/index.html b/docs/index.html
index 7e3c5e3..4e43fc0 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -41,6 +41,21 @@
                     noData: "No matches found.",
                     depth: 2,
                 },
+                plugins: [
+                    [
+                        "flexible-alerts",
+                        {
+                            style: "flat",
+                            labels: {
+                                NOTE: "Note",
+                                TIP: "Tip",
+                                IMPORTANT: "Important",
+                                WARNING: "Warning",
+                                CAUTION: "Caution",
+                            },
+                        },
+                    ],
+                ],
             };
         </script>
 
@@ -51,5 +66,6 @@
         <script src="https://cdn.jsdelivr.net/npm/prismjs@1/components/prism-bash.min.js"></script>
         <script src="https://cdn.jsdelivr.net/npm/prismjs@1/components/prism-toml.min.js"></script>
         <script src="https://cdn.jsdelivr.net/npm/prismjs@1/components/prism-rust.js"></script>
+        <script src="https://unpkg.com/docsify-plugin-flexible-alerts"></script>
     </body>
 </html>
diff --git a/docs/pages/2-basic/4-chain.md b/docs/pages/2-basic/4-chain.md
index 975ed5b..d47642a 100644
--- a/docs/pages/2-basic/4-chain.md
+++ b/docs/pages/2-basic/4-chain.md
@@ -33,8 +33,7 @@ fn parse_hello(prev: HelloEntry) -> NextProcess {
 }
 ```
 
-> **About NextProcess**
->
+> [!Tip] 
 > `NextProcess` is a marker type in **Mingling**, from `mingling::marker`.
 >
 > It serves no functional purpose other than to simplify the declaration of chain functions. After the `chain!` macro expands, `NextProcess` will be replaced with `mingling::ChainProcess<ThisProgram>`.
diff --git a/docs/pages/2-basic/5-renderer.md b/docs/pages/2-basic/5-renderer.md
index 2dc7e27..2085d40 100644
--- a/docs/pages/2-basic/5-renderer.md
+++ b/docs/pages/2-basic/5-renderer.md
@@ -44,8 +44,7 @@ fn render_hello(prev: ParsedHello) {
 }
 ```
 
-> **About r_print**
->
+> [!Tip]
 > `r_print!` can only be used inside a `Renderer`. This is because after the `renderer!` macro expands, it injects `r: &mut RenderResult` into the context.
 >
 > And `r_print!` directly writes content to the value `r`.
diff --git a/docs/pages/3-features/2-general-renderer.md b/docs/pages/3-features/2-general-renderer.md
index ec5474f..c3b81a2 100644
--- a/docs/pages/3-features/2-general-renderer.md
+++ b/docs/pages/3-features/2-general-renderer.md
@@ -45,8 +45,7 @@ struct YourInfo {
 }
 ```
 
-> 💡 Tips
-> 
+> [!Tip]
 > If there are types that do not implement `serde::Serialize`, compilation will fail.
 
 ## Import GeneralRendererSetup
diff --git a/docs/pages/3-features/3-comp.md b/docs/pages/3-features/3-comp.md
index a871d10..259e174 100644
--- a/docs/pages/3-features/3-comp.md
+++ b/docs/pages/3-features/3-comp.md
@@ -112,6 +112,7 @@ fn main() {
 
 `build_comp_scripts` will generate the corresponding completion scripts based on your platform and output them to the `target` directory.
 
+> [!Note]
 > The completion script does not contain the actual completion logic; 
 >
 > it is just a thin invocation layer.