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

#2045 Adjusted styling css to make use of state diagram theme variables

Browse Source
This commit is contained in:
Knut Sveidqvist
2021-05-06 20:26:00 +02:00
parent 785e5552ae
commit 30faf7bfad
7 changed files with 113 additions and 201 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -17,7 +17,7 @@ g.stateGroup text {
}
g.stateGroup .state-title {
font-weight: bolder;
fill: ${options.labelColor};
fill: ${options.stateLabelColor};
}
g.stateGroup rect {
@@ -65,7 +65,7 @@ g.stateGroup line {
}
.edgeLabel .label rect {
fill: ${options.tertiaryColor};
fill: ${options.labelBackgroundColor};
opacity: 0.5;
}
.edgeLabel .label text {
@@ -76,7 +76,7 @@ g.stateGroup line {
}
.stateLabel text {
fill: ${options.labelColor};
fill: ${options.stateLabelColor};
font-size: 10px;
font-weight: bold;
}
@@ -98,7 +98,7 @@ g.stateGroup line {
.node rect {
fill: ${options.stateBkg || options.mainBkg};
stroke: ${options.nodeBorder};
stroke: ${options.stateBorder || options.nodeBorder};
stroke-width: 1px;
}
.node polygon {
@@ -112,12 +112,12 @@ g.stateGroup line {
.statediagram-cluster rect {
fill: ${options.clusterTitleBackground};
stroke: ${options.compositeBorder || options.nodeBorder};
stroke: ${options.stateBorder || options.nodeBorder};
stroke-width: 1px;
}
.cluster-label, .nodeLabel {
color: ${options.labelColor};
color: ${options.stateLabelColor};
}
.statediagram-cluster rect.outer {
@@ -125,7 +125,7 @@ g.stateGroup line {
ry: 5px;
}
.statediagram-state .divider {
stroke: ${options.nodeBorder};
stroke: ${options.stateBorder || options.nodeBorder};
}
.statediagram-state .title-state {