diff --git a/demos/classchart.html b/demos/classchart.html
index 031f3b608..b879618b6 100644
--- a/demos/classchart.html
+++ b/demos/classchart.html
@@ -17,10 +17,10 @@
Class diagram demos
----
-title: Demo Class Diagram
----
- classDiagram
+ ---
+ title: Demo Class Diagram
+ ---
+ classDiagram
accTitle: Demo Class Diagram
accDescr: This class diagram show the abstract Animal class, and 3 classes that inherit from it: Duck, Fish, and Zebra.
diff --git a/demos/er.html b/demos/er.html
index 06fbf020e..b5d1966f7 100644
--- a/demos/er.html
+++ b/demos/er.html
@@ -19,43 +19,42 @@
+ ---
+ title: This is a title
+ ---
+ erDiagram
+ %% title This is a title
+ %% accDescription Test a description
----
-title: This is a title
----
-erDiagram
- %% title This is a title
- %% accDescription Test a description
+ "Person . CUSTOMER"||--o{ ORDER : places
- "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]" {
- 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
- }
+ "a_~`!@#$^&*()-_=+[]{}|/;:'.?¡⁄™€£‹¢›∞fi§‡•°ª·º‚≠±œŒ∑„®†ˇ¥Á¨ˆˆØπ∏“«»åÅßÍ∂΃ϩ˙Ó∆Ô˚¬Ò…ÚæÆΩ¸≈π˛çÇ√◊∫ı˜µÂ≤¯≥˘÷¿" {
+ 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"
+ }
- "a_~`!@#$^&*()-_=+[]{}|/;:'.?¡⁄™€£‹¢›∞fi§‡•°ª·º‚≠±œŒ∑„®†ˇ¥Á¨ˆˆØπ∏“«»åÅßÍ∂΃ϩ˙Ó∆Ô˚¬Ò…ÚæÆΩ¸≈π˛çÇ√◊∫ı˜µÂ≤¯≥˘÷¿" {
- 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"
- }
-
- "€£LINE_ITEM ¥" {
- int orderID FK
- int currencyId FK
- number price
- number quantity
- number adjustment
- number final_price
- }
+ "€£LINE_ITEM ¥" {
+ int orderID FK
+ int currencyId FK
+ number price
+ number quantity
+ number adjustment
+ number final_price
+ }
diff --git a/demos/flowchart.html b/demos/flowchart.html
index 7251e586e..60e6160c3 100644
--- a/demos/flowchart.html
+++ b/demos/flowchart.html
@@ -17,9 +17,9 @@
Sample 1
graph
----
-title: This is a complicated flow
----
+ ---
+ title: This is a complicated flow
+ ---
graph LR
accTitle: This is a complicated flow
accDescr: This is the descriptoin for the complicated flow.
@@ -224,9 +224,9 @@ title: This is a complicated flow
Sample 2
graph
----
-title: What to buy
----
+ ---
+ title: What to buy
+ ---
graph TD
accTitle: What to buy
accDescr: Options of what to buy with Christmas money
diff --git a/demos/git.html b/demos/git.html
index 99c53d7d0..5e683152a 100644
--- a/demos/git.html
+++ b/demos/git.html
@@ -16,9 +16,9 @@
Git diagram demo
----
-title: Simple Git diagram
----
+ ---
+ title: Simple Git diagram
+ ---
gitGraph:
options
{
diff --git a/demos/journey.html b/demos/journey.html
index dadcfb13c..96c89a215 100644
--- a/demos/journey.html
+++ b/demos/journey.html
@@ -16,9 +16,9 @@
Journey diagram demo
----
-title: My working day
----
+ ---
+ title: My working day
+ ---
journey
accTitle: Very simple journey demo
accDescr: 2 main sections: work and home, each with just a few tasks
diff --git a/demos/state.html b/demos/state.html
index 3d070f379..9251e837c 100644
--- a/demos/state.html
+++ b/demos/state.html
@@ -17,11 +17,11 @@
State diagram demos
Very simple showing change from State1 to State2
----
-title: Very simple diagram
----
- stateDiagram
- accTitle: This is the accessible title
+ ---
+ title: Very simple diagram
+ ---
+ stateDiagram
+ accTitle: This is the accessible title
accDescr:This is an accessible description
State1 --> State2
@@ -47,13 +47,13 @@ title: Very simple diagram
----
-title: Very simple diagram
----
- stateDiagram
+ ---
+ title: Very simple diagram
+ ---
+ stateDiagram
direction TB
- accTitle: This is the accessible title
+ accTitle: This is the accessible title
accDescr: This is an accessible description
classDef notMoving fill:white