marcel/mermaid
1
0
Fork 0
mirror of https://github.com/mermaid-js/mermaid.git synced 2025-09-19 15:30:03 +02:00
Code Issues Packages Projects Releases Wiki Activity

docs(demos): fix indentation of YAML front-matter

Browse Source 
Mermaid diagrams that have YAML front-matter can now be indented in
HTML code, see commit:
5cfa9196 (fix: support parsing indented mmd YAML from HTML, 2022-11-27)

Some diagrams previously had a mix of tabs/spaces for indentation.
In order for `dedent` to work, these diagrams had to be converted to
using a consistent indentation.
This commit is contained in:
Alois Klink
2022-11-27 18:25:37 +00:00
parent 5cfa919672
commit 4cc3b17d36
6 changed files with 56 additions and 57 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
demos/classchart.html
View File

@@ -17,10 +17,10 @@
<h1>Class diagram demos</h1> <h1>Class diagram demos</h1>
<pre class="mermaid"> <pre class="mermaid">
--- ---
title: Demo Class Diagram title: Demo Class Diagram
--- ---
classDiagram classDiagram
accTitle: Demo Class Diagram accTitle: Demo Class Diagram
accDescr: This class diagram show the abstract Animal class, and 3 classes that inherit from it: Duck, Fish, and Zebra. accDescr: This class diagram show the abstract Animal class, and 3 classes that inherit from it: Duck, Fish, and Zebra.

61
demos/er.html
View File

@@ -19,43 +19,42 @@
<body> <body>
<pre class="mermaid"> <pre class="mermaid">
---
title: This is a title
---
erDiagram
%% title This is a title
%% accDescription Test a description
--- "Person . CUSTOMER"||--o{ ORDER : places
title: This is a title
---
erDiagram
%% title This is a title
%% accDescription Test a description
"Person . CUSTOMER"||--o{ ORDER : places ORDER ||--|{ "€£LINE_ITEM ¥" : contains
ORDER ||--|{ "€£LINE_ITEM ¥" : contains "Person . CUSTOMER" }|..|{ "Address//StreetAddress::[DELIVERY ADDRESS]" : uses
"Person . CUSTOMER" }|..|{ "Address//StreetAddress::[DELIVERY ADDRESS]" : uses "Address//StreetAddress::[DELIVERY ADDRESS]" {
int customerID FK
string line1 "this is the first address line comment"
string line2
string city
string region
string state
string postal_code
string country
}
"Address//StreetAddress::[DELIVERY ADDRESS]" { "a_~`!@#$^&*()-_=+[]{}|/;:'.?¡⁄™€£‹¢›∞fi§‡•°ª·º‚≠±œŒ∑„®†ˇ¥Á¨ˆˆØπ∏“«»åÅßÍ∂΃ϩ˙Ó∆Ô˚¬Ò…ÚæÆΩ¸≈π˛çÇ√◊∫ı˜µÂ≤¯≥˘÷¿" {
int customerID FK string name "this is an entity with an absurd name just to show characters that are now acceptable as long as the name is in double quotes"
string line1 "this is the first address line comment" }
string line2
string city
string region
string state
string postal_code
string country
}
"a_~`!@#$^&*()-_=+[]{}|/;:'.?¡⁄™€£‹¢›∞fi§‡•°ª·º‚≠±œŒ∑„®†ˇ¥Á¨ˆˆØπ∏“«»åÅßÍ∂΃ϩ˙Ó∆Ô˚¬Ò…ÚæÆΩ¸≈π˛çÇ√◊∫ı˜µÂ≤¯≥˘÷¿" { "€£LINE_ITEM ¥" {
string name "this is an entity with an absurd name just to show characters that are now acceptable as long as the name is in double quotes" int orderID FK
} int currencyId FK
number price
"€£LINE_ITEM ¥" { number quantity
int orderID FK number adjustment
int currencyId FK number final_price
number price }
number quantity
number adjustment
number final_price
}
</pre> </pre>
<script src="./mermaid.js"></script> <script src="./mermaid.js"></script>

12
demos/flowchart.html
View File

@@ -17,9 +17,9 @@
<h2>Sample 1</h2> <h2>Sample 1</h2>
<h3>graph</h3> <h3>graph</h3>
<pre class="mermaid"> <pre class="mermaid">
--- ---
title: This is a complicated flow title: This is a complicated flow
--- ---
graph LR graph LR
accTitle: This is a complicated flow accTitle: This is a complicated flow
accDescr: This is the descriptoin for the complicated flow. accDescr: This is the descriptoin for the complicated flow.
@@ -224,9 +224,9 @@ title: This is a complicated flow
<h2>Sample 2</h2> <h2>Sample 2</h2>
<h3>graph</h3> <h3>graph</h3>
<pre class="mermaid"> <pre class="mermaid">
--- ---
title: What to buy title: What to buy
--- ---
graph TD graph TD
accTitle: What to buy accTitle: What to buy
accDescr: Options of what to buy with Christmas money accDescr: Options of what to buy with Christmas money

6
demos/git.html
View File

@@ -16,9 +16,9 @@
<body> <body>
<h1>Git diagram demo</h1> <h1>Git diagram demo</h1>
<pre class="mermaid"> <pre class="mermaid">
--- ---
title: Simple Git diagram title: Simple Git diagram
--- ---
gitGraph: gitGraph:
options options
{ {

6
demos/journey.html
View File

@@ -16,9 +16,9 @@
<body> <body>
<h1>Journey diagram demo</h1> <h1>Journey diagram demo</h1>
<pre class="mermaid"> <pre class="mermaid">
--- ---
title: My working day title: My working day
--- ---
journey journey
accTitle: Very simple journey demo accTitle: Very simple journey demo
accDescr: 2 main sections: work and home, each with just a few tasks accDescr: 2 main sections: work and home, each with just a few tasks

20
demos/state.html
View File

@@ -17,11 +17,11 @@
<h1>State diagram demos</h1> <h1>State diagram demos</h1>
<h2>Very simple showing change from State1 to State2</h2> <h2>Very simple showing change from State1 to State2</h2>
<pre class="mermaid"> <pre class="mermaid">
--- ---
title: Very simple diagram title: Very simple diagram
--- ---
stateDiagram stateDiagram
accTitle: This is the accessible title accTitle: This is the accessible title
accDescr:This is an accessible description accDescr:This is an accessible description
State1 --> State2 State1 --> State2
</pre> </pre>
@@ -47,13 +47,13 @@ title: Very simple diagram
</code> </code>
</p> </p>
<pre class="mermaid"> <pre class="mermaid">
--- ---
title: Very simple diagram title: Very simple diagram
--- ---
stateDiagram stateDiagram
direction TB direction TB
accTitle: This is the accessible title accTitle: This is the accessible title
accDescr: This is an accessible description accDescr: This is an accessible description
classDef notMoving fill:white classDef notMoving fill:white