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

Set a less prominent color in nested composite state and added demo page of styling

Browse Source
This commit is contained in:
Per Brolin
2024-06-12 14:54:03 +02:00
parent 7ff731163f
commit f17d788ac8
3 changed files with 1469 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1466
cypress/platform/state-refactor-neo.html Normal file
View File

File diff suppressed because it is too large Load Diff

5
packages/mermaid/src/diagrams/state/styles.js
View File

@@ -107,7 +107,7 @@ g.stateGroup line {
} }
.end-state-inner { .end-state-inner {
fill: ${options.compositeBackground || options.background}; fill: ${options.compositeBackground || options.background};
// stroke: ${options.background}; stroke: ${options.background};
stroke-width: 1.5 stroke-width: 1.5
} }
@@ -152,8 +152,7 @@ g.stateGroup line {
fill: ${options.compositeBackground || options.background}; fill: ${options.compositeBackground || options.background};
} }
.statediagram-cluster.statediagram-cluster-alt .inner { .statediagram-cluster.statediagram-cluster-alt .inner {
fill: ${options.altBackground ? options.altBackground : '#efefef'}; fill: ${options.altBackground ? options.altBackground : '#f0f0f0'};
} }
.statediagram-cluster .inner { .statediagram-cluster .inner {

2
packages/mermaid/src/themes/theme-neo.js
View File

@@ -125,7 +125,7 @@ class Theme {
this.stateBkg = this.stateBkg || this.mainBkg; this.stateBkg = this.stateBkg || this.mainBkg;
this.labelBackgroundColor = this.labelBackgroundColor || this.stateBkg; this.labelBackgroundColor = this.labelBackgroundColor || this.stateBkg;
this.compositeBackground = this.compositeBackground || this.background || this.tertiaryColor; this.compositeBackground = this.compositeBackground || this.background || this.tertiaryColor;
this.altBackground = this.altBackground || this.tertiaryColor; this.altBackground = this.altBackground || '#f0f0f0';
this.compositeTitleBackground = this.compositeTitleBackground || this.mainBkg; this.compositeTitleBackground = this.compositeTitleBackground || this.mainBkg;
this.compositeBorder = this.compositeBorder || this.nodeBorder; this.compositeBorder = this.compositeBorder || this.nodeBorder;
this.innerEndBackground = this.nodeBorder; this.innerEndBackground = this.nodeBorder;