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

#5237 Updating configuration otions and adding handdrawnSeed

Browse Source
This commit is contained in:
Knut Sveidqvist
2024-05-10 14:56:52 +02:00
parent 2f80c3a2c4
commit ab077992f5
14 changed files with 86 additions and 82 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
cypress/platform/knsv2.html
View File

@@ -32,7 +32,7 @@
<style>
body {
/* background: rgb(221, 208, 208); */
/* background: #333; */
background: #333;
font-family: 'Arial';
/* font-size: 18px !important; */
}
@@ -120,7 +120,7 @@ stateDiagram-v2
</pre
>
<pre id="diagram" class="mermaid">
%%{init: {"handdrawn": false} }%%
%%{init: {"look": "classic"} }%%
stateDiagram-v2
TN3: The state with a note
note right of TN3
@@ -522,8 +522,9 @@ mindmap
// useMaxWidth: false,
// });
mermaid.initialize({
theme: 'base',
handdrawn: true,
theme: 'dark',
handdrawnSeed: 12,
look: 'handdrawn',
// layout: 'dagre',
layout: 'elk',
flowchart: { titleTopMargin: 10 },

70
cypress/platform/state-refactor.html
View File

@@ -114,7 +114,7 @@ stateDiagram-v2
</td>
<td>
<pre id="diagram2" class="mermaid">
%%{init: {"handdrawn": true} }%%
%%{init: {"look": "handdrawn"} }%%
stateDiagram-v2
stateId
@@ -130,7 +130,7 @@ stateDiagram-v2
</td>
<td>
<pre id="diagram4" class="mermaid">
%%{init: {"handdrawn": true, "layout": "elk"} }%%
%%{init: {"look": "handdrawn", "layout": "elk"} }%%
stateDiagram-v2
stateId
@@ -161,7 +161,7 @@ stateDiagram-v2
</td>
<td>
<pre id="diagram2" class="mermaid">
%%{init: {"handdrawn": true} }%%
%%{init: {"look": "handdrawn"} }%%
stateDiagram-v2
state "This is a state description" as s3
</pre>
@@ -175,7 +175,7 @@ stateDiagram-v2
</td>
<td>
<pre id="diagram4" class="mermaid">
%%{init: {"handdrawn": true, "layout": "elk"} }%%
%%{init: {"look": "handdrawn", "layout": "elk"} }%%
stateDiagram-v2
state "This is a state description" as s5
</pre>
@@ -205,7 +205,7 @@ stateDiagram-v2
</td>
<td>
<pre id="diagram2" class="mermaid">
%%{init: {"handdrawn": true} }%%
%%{init: {"look": "handdrawn"} }%%
stateDiagram-v2
s22 : This is a state description
@@ -221,7 +221,7 @@ stateDiagram-v2
</td>
<td>
<pre id="diagram4" class="mermaid">
%%{init: {"handdrawn": true, "layout": "elk"} }%%
%%{init: {"look": "handdrawn", "layout": "elk"} }%%
stateDiagram-v2
s24 : This is a state description
@@ -257,7 +257,7 @@ stateDiagram-v2
</td>
<td>
<pre id="diagram2" class="mermaid">
%%{init: {"handdrawn": true} }%%
%%{init: {"look": "handdrawn"} }%%
stateDiagram-v2
s41 --> s42
@@ -276,7 +276,7 @@ stateDiagram-v2
</td>
<td>
<pre id="diagram4" class="mermaid">
%%{init: {"handdrawn": true, "layout": "elk"} }%%
%%{init: {"look": "handdrawn", "layout": "elk"} }%%
stateDiagram-v2
s61 --> s62
@@ -315,7 +315,7 @@ stateDiagram-v2
</td>
<td>
<pre id="diagram2" class="mermaid">
%%{init: {"handdrawn": true} }%%
%%{init: {"look": "handdrawn"} }%%
stateDiagram-v2
a3 --> a4: A transition
@@ -334,7 +334,7 @@ stateDiagram-v2
</td>
<td>
<pre id="diagram4" class="mermaid">
%%{init: {"handdrawn": true, "layout": "elk"} }%%
%%{init: {"look": "handdrawn", "layout": "elk"} }%%
stateDiagram-v2
a7 --> a8: A transition
@@ -375,7 +375,7 @@ stateDiagram-v2
</td>
<td>
<pre id="diagram2" class="mermaid">
%%{init: {"handdrawn": true} }%%
%%{init: {"look": "handdrawn"} }%%
stateDiagram-v2
[*] --> test
@@ -396,7 +396,7 @@ stateDiagram-v2
</td>
<td>
<pre id="diagram4" class="mermaid">
%%{init: {"handdrawn": true, "layout": "elk"} }%%
%%{init: {"look": "handdrawn", "layout": "elk"} }%%
stateDiagram-v2
[*] --> test
test --> [*]
@@ -444,7 +444,7 @@ stateDiagram-v2
</td>
<td>
<pre id="diagram2" class="mermaid">
%%{init: {"handdrawn": true} }%%
%%{init: {"look": "handdrawn"} }%%
stateDiagram-v2
[*] --> First
@@ -471,7 +471,7 @@ stateDiagram-v2
</td>
<td>
<pre id="diagram4" class="mermaid">
%%{init: {"handdrawn": true, "layout": "elk"} }%%
%%{init: {"look": "handdrawn", "layout": "elk"} }%%
stateDiagram-v2
[*] --> First
state First {
@@ -540,13 +540,13 @@ stateDiagram-v2
}
}
}
</pre>
</td>
<td>
<pre id="diagram2" class="mermaid">
%%{init: {"handdrawn": true} }%%
%%{init: {"look": "handdrawn"} }%%
stateDiagram-v2
[*] --> Level1
@@ -564,7 +564,7 @@ stateDiagram-v2
}
}
}
</pre>
@@ -588,13 +588,13 @@ stateDiagram-v2
}
}
}
</pre>
</td>
<td>
<pre id="diagram4" class="mermaid">
%%{init: {"handdrawn": true, "layout": "elk"} }%%
%%{init: {"look": "handdrawn", "layout": "elk"} }%%
stateDiagram-v2
[*] --> Level1
@@ -611,7 +611,7 @@ stateDiagram-v2
}
}
}
</pre>
</td>
</tr>
@@ -675,7 +675,7 @@ stateDiagram-v2
</td>
<td>
<pre id="diagram2" class="mermaid">
%%{init: {"handdrawn": true} }%%
%%{init: {"look": "handdrawn"} }%%
stateDiagram-v2
[*] --> B1
@@ -721,7 +721,7 @@ stateDiagram-v2
</td>
<td>
<pre id="diagram4" class="mermaid">
%%{init: {"handdrawn": true, "layout": "elk"} }%%
%%{init: {"look": "handdrawn", "layout": "elk"} }%%
stateDiagram-v2
[*] --> B1
B1 --> B2
@@ -783,7 +783,7 @@ stateDiagram-v2
</td>
<td>
<pre id="diagram2" class="mermaid">
%%{init: {"handdrawn": true} }%%
%%{init: {"look": "handdrawn"} }%%
stateDiagram-v2
state if_state <<choice>>
@@ -806,7 +806,7 @@ stateDiagram-v2
</td>
<td>
<pre id="diagram4" class="mermaid">
%%{init: {"handdrawn": true, "layout": "elk"} }%%
%%{init: {"look": "handdrawn", "layout": "elk"} }%%
stateDiagram-v2
state if_state <<choice>>
[*] --> IsPositive
@@ -864,7 +864,7 @@ stateDiagram-v2
</td>
<td>
<pre id="diagram2" class="mermaid">
%%{init: {"handdrawn": true} }%%
%%{init: {"look": "handdrawn"} }%%
stateDiagram-v2
state fork_state <<fork>>
[*] --> fork_state
@@ -898,7 +898,7 @@ stateDiagram-v2
</td>
<td>
<pre id="diagram4" class="mermaid">
%%{init: {"handdrawn": true, "layout": "elk"} }%%
%%{init: {"look": "handdrawn", "layout": "elk"} }%%
stateDiagram-v2
state fork_state <<fork>>
[*] --> fork_state
@@ -954,7 +954,7 @@ stateDiagram-v2
</td>
<td>
<pre id="diagram2" class="mermaid">
%%{init: {"handdrawn": true} }%%
%%{init: {"look": "handdrawn"} }%%
stateDiagram-v2
TN3: The state with a note
note right of TN3
@@ -981,7 +981,7 @@ stateDiagram-v2
</td>
<td>
<pre id="diagram4" class="mermaid">
%%{init: {"handdrawn": true, "layout": "elk"} }%%
%%{init: {"look": "handdrawn", "layout": "elk"} }%%
stateDiagram-v2
TN7: The state with a note
note right of TN7
@@ -1051,7 +1051,7 @@ state Active {
</td>
<td>
<pre id="diagram2" class="mermaid">
%%{init: {"handdrawn": true} }%%
%%{init: {"look": "handdrawn"} }%%
stateDiagram-v2
[*] --> Active
@@ -1094,7 +1094,7 @@ state Active {
</td>
<td>
<pre id="diagram4" class="mermaid">
%%{init: {"handdrawn": true, "layout": "elk"} }%%
%%{init: {"look": "handdrawn", "layout": "elk"} }%%
stateDiagram-v2
[*] --> Active
@@ -1158,7 +1158,7 @@ direction LR
</td>
<td>
<pre id="diagram2" class="mermaid">
%%{init: {"handdrawn": true} }%%
%%{init: {"look": "handdrawn"} }%%
stateDiagram-v2
direction LR
[*] --> D1
@@ -1188,7 +1188,7 @@ direction LR
</td>
<td>
<pre id="diagram4" class="mermaid">
%%{init: {"handdrawn": true, "layout": "elk"} }%%
%%{init: {"look": "handdrawn", "layout": "elk"} }%%
stateDiagram-v2
direction LR
[*] --> D1
@@ -1248,11 +1248,11 @@ direction LR
};
var coll = document.getElementsByClassName("collapsible");
for (var i = 0; i < coll.length; i++) {
let coll = document.getElementsByClassName("collapsible");
for (let i = 0; i < coll.length; i++) {
coll[i].addEventListener("click", function () {
this.classList.toggle("active");
var content = this.nextElementSibling;
let content = this.nextElementSibling;
if (content.style.maxHeight) {
content.style.maxHeight = null;
} else {