GitHub/mermaid
1
0
Fork 0
mirror of https://github.com/mermaid-js/mermaid.git synced 2025-01-14 06:43:25 +08:00
Code Issues Projects Releases Wiki Activity

#2045 name change of state diagram specific theme variable

Browse Source
This commit is contained in:
Knut Sveidqvist 2021-05-09 10:56:39 +02:00
parent 413bdce17c
commit 4720ede442
7 changed files with 10 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
cypress/platform/knsv.html
View File

@ -10,7 +10,7 @@
<style> <style>
body { body {
/* background: rgb(221, 208, 208); */ /* background: rgb(221, 208, 208); */
/* background:#333; */ background:#333;
font-family: 'Arial'; font-family: 'Arial';
/* font-size: 18px !important; */ /* font-size: 18px !important; */
} }
@ -28,7 +28,7 @@
<div class="flex"> <div class="flex">
<div class="mermaid" style="width: 100%; height: 20%;"> <div class="mermaid" style="width: 100%; height: 20%;">
%%{int:{ %%{init:{
"themeVariables": { "themeVariables": {
"transitionColor":"red", "transitionColor":"red",
"labelColor":"yellow", "labelColor":"yellow",
@ -37,7 +37,7 @@
"compositeBackground":"pink", "compositeBackground":"pink",
"altBackground":"purple", "altBackground":"purple",
"clusterTitleBackground":"blue", "clusterTitleBackground":"blue",
"compositeBorder":"red", "stateBorder":"red",
"noteBorderColor":"#522", "noteBorderColor":"#522",
"noteBkgColor":"#522", "noteBkgColor":"#522",
"noteTextColor":"white" "noteTextColor":"white"
@ -52,7 +52,7 @@ stateDiagram-v2
AnotherState --> YetANotherState:a label AnotherState --> YetANotherState:a label
} }
-- --
SSTAte MyState
} }
note left of CompositeState note left of CompositeState
Important information! You can write Important information! You can write

2
src/diagrams/state/styles.js
View File

@ -111,7 +111,7 @@ g.stateGroup line {
} }
.statediagram-cluster rect { .statediagram-cluster rect {
fill: ${options.clusterTitleBackground}; fill: ${options.compositeTitleBackground};
stroke: ${options.stateBorder || options.nodeBorder}; stroke: ${options.stateBorder || options.nodeBorder};
stroke-width: 1px; stroke-width: 1px;
} }

2
src/themes/theme-base.js
View File

@ -119,7 +119,7 @@ class Theme {
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 || this.tertiaryColor;
this.clusterTitleBackground = this.clusterTitleBackground || this.mainBkg; this.compositeTitleBackground = this.compositeTitleBackground || this.mainBkg;
this.compositeBorder = this.compositeBorder || this.nodeBorder; this.compositeBorder = this.compositeBorder || this.nodeBorder;
this.errorBkgColor = this.errorBkgColor || this.tertiaryColor; this.errorBkgColor = this.errorBkgColor || this.tertiaryColor;

2
src/themes/theme-dark.js
View File

@ -134,7 +134,7 @@ class Theme {
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 || '#555'; this.altBackground = this.altBackground || '#555';
this.clusterTitleBackground = this.clusterTitleBackground || this.mainBkg; this.compositeTitleBackground = this.compositeTitleBackground || this.mainBkg;
this.compositeBorder = this.compositeBorder || this.nodeBorder; this.compositeBorder = this.compositeBorder || this.nodeBorder;
this.errorBkgColor = this.errorBkgColor || this.tertiaryColor; this.errorBkgColor = this.errorBkgColor || this.tertiaryColor;

2
src/themes/theme-default.js
View File

@ -147,7 +147,7 @@ class Theme {
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 || '#f0f0f0'; this.altBackground = this.altBackground || '#f0f0f0';
this.clusterTitleBackground = this.clusterTitleBackground || this.mainBkg; this.compositeTitleBackground = this.compositeTitleBackground || this.mainBkg;
this.compositeBorder = this.compositeBorder || this.nodeBorder; this.compositeBorder = this.compositeBorder || this.nodeBorder;
this.errorBkgColor = this.errorBkgColor || this.tertiaryColor; this.errorBkgColor = this.errorBkgColor || this.tertiaryColor;

2
src/themes/theme-forest.js
View File

@ -117,7 +117,7 @@ class Theme {
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 || '#f0f0f0'; this.altBackground = this.altBackground || '#f0f0f0';
this.clusterTitleBackground = this.clusterTitleBackground || this.mainBkg; this.compositeTitleBackground = this.compositeTitleBackground || this.mainBkg;
this.compositeBorder = this.compositeBorder || this.nodeBorder; this.compositeBorder = this.compositeBorder || this.nodeBorder;
this.errorBkgColor = this.errorBkgColor || this.tertiaryColor; this.errorBkgColor = this.errorBkgColor || this.tertiaryColor;

2
src/themes/theme-neutral.js
View File

@ -154,7 +154,7 @@ class Theme {
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 || '#f4f4f4'; this.altBackground = this.altBackground || '#f4f4f4';
this.clusterTitleBackground = this.clusterTitleBackground || this.mainBkg; this.compositeTitleBackground = this.compositeTitleBackground || this.mainBkg;
this.stateBorder = this.stateBorder || '#000'; this.stateBorder = this.stateBorder || '#000';
this.errorBkgColor = this.errorBkgColor || this.tertiaryColor; this.errorBkgColor = this.errorBkgColor || this.tertiaryColor;