diff --git a/docs/config/theming.md b/docs/config/theming.md index f8614b44b1..5abccc7e4a 100644 --- a/docs/config/theming.md +++ b/docs/config/theming.md @@ -250,7 +250,7 @@ The theming engine will only recognize hex colors and not color names. So, the v | actorBkg | mainBkg | Actor Background Color | | actorBorder | primaryBorderColor | Actor Border Color | | actorTextColor | primaryTextColor | Actor Text Color | -| actorLineColor | grey | Actor Line Color | +| actorLineColor | actorBorder | Actor Line Color | | signalColor | textColor | Signal Color | | signalTextColor | textColor | Signal Text Color | | labelBoxBkgColor | actorBkg | Label Box Background Color | diff --git a/packages/mermaid/src/diagrams/sequence/svgDraw.js b/packages/mermaid/src/diagrams/sequence/svgDraw.js index 17842b092d..160477637e 100644 --- a/packages/mermaid/src/diagrams/sequence/svgDraw.js +++ b/packages/mermaid/src/diagrams/sequence/svgDraw.js @@ -343,10 +343,10 @@ const drawActorTypeParticipant = async function (elem, actor, conf, isFooter) { .attr('y1', centerY) .attr('x2', center) .attr('y2', 2000) - .attr('class', 'actor-line') - .attr('class', '200') + .attr('class', 'actor-line 200') .attr('stroke-width', '0.5px') - .attr('stroke', '#999'); + .attr('stroke', '#999') + .attr('name', actor.name); g = boxplusLineGroup.append('g'); actor.actorCnt = actorCnt; @@ -425,10 +425,10 @@ const drawActorTypeActor = async function (elem, actor, conf, isFooter) { .attr('y1', centerY) .attr('x2', center) .attr('y2', 2000) - .attr('class', 'actor-line') - .attr('class', '200') + .attr('class', 'actor-line 200') .attr('stroke-width', '0.5px') - .attr('stroke', '#999'); + .attr('stroke', '#999') + .attr('name', actor.name); actor.actorCnt = actorCnt; } diff --git a/packages/mermaid/src/docs/config/theming.md b/packages/mermaid/src/docs/config/theming.md index 590301d70d..3863202b42 100644 --- a/packages/mermaid/src/docs/config/theming.md +++ b/packages/mermaid/src/docs/config/theming.md @@ -172,7 +172,7 @@ The theming engine will only recognize hex colors and not color names. So, the v | actorBkg | mainBkg | Actor Background Color | | actorBorder | primaryBorderColor | Actor Border Color | | actorTextColor | primaryTextColor | Actor Text Color | -| actorLineColor | grey | Actor Line Color | +| actorLineColor | actorBorder | Actor Line Color | | signalColor | textColor | Signal Color | | signalTextColor | textColor | Signal Text Color | | labelBoxBkgColor | actorBkg | Label Box Background Color | diff --git a/packages/mermaid/src/themes/theme-base.js b/packages/mermaid/src/themes/theme-base.js index d1a6eae2ab..dde3b9ecff 100644 --- a/packages/mermaid/src/themes/theme-base.js +++ b/packages/mermaid/src/themes/theme-base.js @@ -70,7 +70,7 @@ class Theme { this.actorBorder = this.actorBorder || this.primaryBorderColor; this.actorBkg = this.actorBkg || this.mainBkg; this.actorTextColor = this.actorTextColor || this.primaryTextColor; - this.actorLineColor = this.actorLineColor || 'grey'; + this.actorLineColor = this.actorLineColor || this.actorBorder; this.labelBoxBkgColor = this.labelBoxBkgColor || this.actorBkg; this.signalColor = this.signalColor || this.textColor; this.signalTextColor = this.signalTextColor || this.textColor; diff --git a/packages/mermaid/src/themes/theme-dark.js b/packages/mermaid/src/themes/theme-dark.js index dc7a600098..02104a0ea8 100644 --- a/packages/mermaid/src/themes/theme-dark.js +++ b/packages/mermaid/src/themes/theme-dark.js @@ -109,7 +109,7 @@ class Theme { this.actorBorder = this.border1; this.actorBkg = this.mainBkg; this.actorTextColor = this.mainContrastColor; - this.actorLineColor = this.mainContrastColor; + this.actorLineColor = this.actorBorder; this.signalColor = this.mainContrastColor; this.signalTextColor = this.mainContrastColor; this.labelBoxBkgColor = this.actorBkg; diff --git a/packages/mermaid/src/themes/theme-default.js b/packages/mermaid/src/themes/theme-default.js index 6aa18fcc78..d95ccf59e0 100644 --- a/packages/mermaid/src/themes/theme-default.js +++ b/packages/mermaid/src/themes/theme-default.js @@ -53,7 +53,7 @@ class Theme { this.actorBorder = 'calculated'; this.actorBkg = 'calculated'; this.actorTextColor = 'black'; - this.actorLineColor = 'grey'; + this.actorLineColor = 'calculated'; this.signalColor = 'calculated'; this.signalTextColor = 'calculated'; this.labelBoxBkgColor = 'calculated'; @@ -187,6 +187,7 @@ class Theme { this.loopTextColor = this.actorTextColor; this.noteBorderColor = this.border2; this.noteTextColor = this.actorTextColor; + this.actorLineColor = this.actorBorder; /* Gantt chart variables */ diff --git a/packages/mermaid/src/themes/theme-forest.js b/packages/mermaid/src/themes/theme-forest.js index eda905c661..4bb7d24413 100644 --- a/packages/mermaid/src/themes/theme-forest.js +++ b/packages/mermaid/src/themes/theme-forest.js @@ -46,7 +46,7 @@ class Theme { this.actorBorder = 'calculated'; this.actorBkg = 'calculated'; this.actorTextColor = 'black'; - this.actorLineColor = 'grey'; + this.actorLineColor = 'calculated'; this.signalColor = '#333'; this.signalTextColor = '#333'; this.labelBoxBkgColor = 'calculated'; @@ -101,6 +101,7 @@ class Theme { this.loopTextColor = this.actorTextColor; this.noteBorderColor = this.border2; this.noteTextColor = this.actorTextColor; + this.actorLineColor = this.actorBorder; /* Each color-set will have a background, a foreground and a border color */ this.cScale0 = this.cScale0 || this.primaryColor; diff --git a/packages/mermaid/src/themes/theme-neutral.js b/packages/mermaid/src/themes/theme-neutral.js index 446a9189d4..4134a985b9 100644 --- a/packages/mermaid/src/themes/theme-neutral.js +++ b/packages/mermaid/src/themes/theme-neutral.js @@ -58,7 +58,7 @@ class Theme { this.actorBorder = 'calculated'; this.actorBkg = 'calculated'; this.actorTextColor = 'calculated'; - this.actorLineColor = 'calculated'; + this.actorLineColor = this.actorBorder; this.signalColor = 'calculated'; this.signalTextColor = 'calculated'; this.labelBoxBkgColor = 'calculated'; @@ -113,7 +113,7 @@ class Theme { this.actorBorder = lighten(this.border1, 23); this.actorBkg = this.mainBkg; this.actorTextColor = this.text; - this.actorLineColor = this.lineColor; + this.actorLineColor = this.actorBorder; this.signalColor = this.text; this.signalTextColor = this.text; this.labelBoxBkgColor = this.actorBkg;