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

Added theming support for gitgraph

Browse Source
This commit is contained in:
Knut Sveidqvist
2022-03-17 20:07:27 +01:00
parent 9f7130a3e6
commit b78b371025
14 changed files with 456 additions and 61 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
cypress/platform/gitgraph.html
View File

@@ -9,7 +9,8 @@
<style>
body {
/* background: rgb(221, 208, 208); */
/*background:#333;*/
background:#111;
/* background:#333; */
font-family: 'Arial';
}
/* h1 { color: white;} */
@@ -103,6 +104,20 @@
};
mermaid.initialize({
theme: 'base',
themeVariables: {
primaryColor: '#9400D3',
darkMode: true,
// background: '#222',
textColor: 'white',
primaryTextColor: '#f4f4f4',
// nodeBkg: '#ff0000',
// mainBkg: '#0000ff',
// tertiaryColor: '#ffffcc',
},
// theme: 'forest',
// theme: 'neutral',
// theme: 'dark',
// arrowMarkerAbsolute: true,
// themeCSS: '.edgePath .path {stroke: red;} .arrowheadPath {fill: red;}',
logLevel: 1,

45
cypress/platform/showcase_base.html
View File

@@ -264,6 +264,51 @@ requirementDiagram
test_req - contains -> test_req3
test_req <- copies - test_entity2
</div>
<div class="mermaid" class="width height">
gitGraph:
commit
branch hotfix
checkout hotfix
commit
branch develop
checkout develop
commit id:"ash" tag:"abc"
branch featureB
checkout featureB
commit type:HIGHLIGHT
checkout master
branch hotfix
checkout hotfix
commit type:NORMAL
checkout develop
commit type:REVERSE
checkout featureB
commit
checkout master
merge hotfix
checkout featureB
commit
checkout develop
branch featureA
commit
checkout develop
merge hotfix
checkout featureA
commit
checkout featureB
commit
checkout develop
merge featureA
branch release
checkout release
commit
checkout master
commit
checkout release
merge master
checkout develop
merge release
</div>
<script src="./mermaid.js"></script>
<script>
mermaid.parseError = function (err, hash) {

67
cypress/platform/showcase_base_dark.html
View File

@@ -258,8 +258,53 @@ requirementDiagram
test_req - contains -> test_req3
test_req <- copies - test_entity2
</div>
<script src="./mermaid.js"></script>
<div class="mermaid" class="width height">
%%{init:{"theme":"base", "themeVariables": {"primaryColor":"#411d4e", "darkMode":true}}}%%
gitGraph:
commit
branch hotfix
checkout hotfix
commit
branch develop
checkout develop
commit id:"ash" tag:"abc"
branch featureB
checkout featureB
commit type:HIGHLIGHT
checkout master
branch hotfix
checkout hotfix
commit type:NORMAL
checkout develop
commit type:REVERSE
checkout featureB
commit
checkout master
merge hotfix
checkout featureB
commit
checkout develop
branch featureA
commit
checkout develop
merge hotfix
checkout featureA
commit
checkout featureB
commit
checkout develop
merge featureA
branch release
checkout release
commit
checkout master
commit
checkout release
merge master
checkout develop
merge release
</div>
<script src="./mermaid.js"></script>
<script>
mermaid.parseError = function (err, hash) {
// console.error('Mermaid error: ', err);
@@ -267,15 +312,15 @@ requirementDiagram
mermaid.initialize({
theme: 'base',
themeVariables: {
primaryColor: '#9400D3',
darkMode: true,
background: '#222',
textColor: 'white',
primaryTextColor: '#f4f4f4',
nodeBkg: '#ff0000',
mainBkg: '#0000ff',
tertiaryColor: '#ffffcc',
},
primaryColor: '#9400D3',
darkMode: true,
background: '#222',
textColor: 'white',
primaryTextColor: '#f4f4f4',
nodeBkg: '#ff0000',
mainBkg: '#0000ff',
tertiaryColor: '#ffffcc',
},
// arrowMarkerAbsolute: true,
// themeCSS: '.edgePath .path {stroke: red;} .arrowheadPath {fill: red;}',
logLevel: 0,

45
cypress/platform/showcase_dark.html
View File

@@ -256,6 +256,51 @@ requirementDiagram
test_req - contains -> test_req3
test_req <- copies - test_entity2
</div>
<div class="mermaid" class="width height">
gitGraph:
commit
branch hotfix
checkout hotfix
commit
branch develop
checkout develop
commit id:"ash" tag:"abc"
branch featureB
checkout featureB
commit type:HIGHLIGHT
checkout master
branch hotfix
checkout hotfix
commit type:NORMAL
checkout develop
commit type:REVERSE
checkout featureB
commit
checkout master
merge hotfix
checkout featureB
commit
checkout develop
branch featureA
commit
checkout develop
merge hotfix
checkout featureA
commit
checkout featureB
commit
checkout develop
merge featureA
branch release
checkout release
commit
checkout master
commit
checkout release
merge master
checkout develop
merge release
</div>
<script src="./mermaid.js"></script>
<script>
mermaid.parseError = function (err, hash) {

47
cypress/platform/showcase_default.html
View File

@@ -251,7 +251,52 @@ requirementDiagram
test_req - contains -> test_req3
test_req <- copies - test_entity2
</div>
<script src="./mermaid.js"></script>
<div class="mermaid" class="width height">
gitGraph:
commit
branch hotfix
checkout hotfix
commit
branch develop
checkout develop
commit id:"ash" tag:"abc"
branch featureB
checkout featureB
commit type:HIGHLIGHT
checkout master
branch hotfix
checkout hotfix
commit type:NORMAL
checkout develop
commit type:REVERSE
checkout featureB
commit
checkout master
merge hotfix
checkout featureB
commit
checkout develop
branch featureA
commit
checkout develop
merge hotfix
checkout featureA
commit
checkout featureB
commit
checkout develop
merge featureA
branch release
checkout release
commit
checkout master
commit
checkout release
merge master
checkout develop
merge release
</div>
<script src="./mermaid.js"></script>
<script>
mermaid.parseError = function (err, hash) {
// console.error('Mermaid error: ', err);

45
cypress/platform/showcase_forest.html
View File

@@ -255,6 +255,51 @@ requirementDiagram
test_req - contains -> test_req3
test_req <- copies - test_entity2
</div>
<div class="mermaid" class="width height">
gitGraph:
commit
branch hotfix
checkout hotfix
commit
branch develop
checkout develop
commit id:"ash" tag:"abc"
branch featureB
checkout featureB
commit type:HIGHLIGHT
checkout master
branch hotfix
checkout hotfix
commit type:NORMAL
checkout develop
commit type:REVERSE
checkout featureB
commit
checkout master
merge hotfix
checkout featureB
commit
checkout develop
branch featureA
commit
checkout develop
merge hotfix
checkout featureA
commit
checkout featureB
commit
checkout develop
merge featureA
branch release
checkout release
commit
checkout master
commit
checkout release
merge master
checkout develop
merge release
</div>
<script src="./mermaid.js"></script>
<script>
mermaid.parseError = function (err, hash) {

47
cypress/platform/showcase_neutral.html
View File

@@ -254,6 +254,53 @@ requirementDiagram
test_req - contains -> test_req3
test_req <- copies - test_entity2
</div>
<div class="mermaid" class="width height">
gitGraph:
commit
branch hotfix
checkout hotfix
commit
branch develop
checkout develop
commit id:"ash" tag:"abc"
branch featureB
checkout featureB
commit type:HIGHLIGHT
checkout master
branch hotfix
checkout hotfix
commit type:NORMAL
checkout develop
commit type:REVERSE
checkout featureB
commit
checkout master
merge hotfix
checkout featureB
commit
checkout develop
branch featureA
commit
checkout develop
merge hotfix
checkout featureA
commit
checkout featureB
commit
checkout develop
merge featureA
branch release
checkout release
commit
checkout master
commit
checkout release
merge master
checkout develop
merge release
</div>
<script src="./mermaid.js"></script>
<script>
mermaid.parseError = function (err, hash) {