mermaidの構文例をテンプレートに追加する (#21)

* document templateにコードブロックの記述例を追加 * document templateの内容を更新し、レンダリング説明を改善 * Mermaidのサンプル画像を更新
tsuna-can-se · Dec 15, 2024 · 410bc32 · 410bc32
1 parent bb979f2
commit 410bc32
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 2 deletions.
diff --git a/docs/_document-template/contents.md b/docs/_document-template/contents.md
@@ -268,7 +268,17 @@ URL を `< >` で囲うと、そのままリンクにできます。
 
 簡単な図は、 [mermaid](https://mermaid.js.org/) で作成できます ( Beta )。
 ` ```mermaid ～ ``` ` で囲った範囲に mermaid 記法で図を記述できます。
-図は次のようにレンダリングできます。
+
+<!-- コードブロックの記述例を示すため、チルダでコードブロックを記述 -->
+<!-- markdownlint-disable-next-line MD048 -->
+~~~md
+```mermaid
+flowchart TD
+    開始 --> 終了
+```
+~~~
+
+これは次のようにレンダリングされます。
 
 ```mermaid
 flowchart TD

diff --git a/pdf-sample.md b/pdf-sample.md
@@ -45,7 +45,7 @@
 
 [Mermaid](https://mermaid.js.org/) の構文を入れることもできます。
 
-![Mermaid のサンプル](https://github.com/user-attachments/assets/23bede4b-f6c8-44e1-a535-8b5f9352e0c1)
+![Mermaid のサンプル](https://github.com/user-attachments/assets/8f896815-0346-403c-a330-cac7bb01dd8f)
 
 ## テーブル