You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
I would expect the following code to render the connector line in green, the label in red, and the label background in blue:
graph LR
A -->|It's the missing link!| B
linkStyle 0 color:red,background-color:hotpink,stroke:green,fill:yellow;
In the rendered HTML, the color attribute is forwarded to the .edgeLabel node and applied as an inline style, thus overriding the default edgeSpan class color. However, the background-color attribute is added to the connector path node inline style, even though path elements do not have a background-color style, only a fill style. I would expect the background-color attribute to be forwarded to the .edgeLabel node along with the color.
<gclass="root"><gclass="clusters"></g><gclass="edgePaths"><!-- The background-color attribute is applied here, to the path node, which cannot use it --><pathmarker-end="url(#graph-div_flowchart-pointEnd)" style="background-color:hotpink;stroke:green;fill:yellow;"
class="edge-thickness-normal edge-pattern-solid flowchart-link LS-A LE-B" id="L-A-B-0"
d="M24.438,19.5L40.454,19.5C56.471,19.5,88.505,19.5,119.656,19.5C150.806,19.5,181.073,19.5,196.207,19.5L211.341,19.5"></path></g><gclass="edgeLabels"><gtransform="translate(120.5390625, 19.5)" class="edgeLabel"><gtransform="translate(-71.1015625, -12)" class="label"><foreignObjectheight="24" width="142.203125"><divxmlns="http://www.w3.org/1999/xhtml" style="color: red; display: inline-block; white-space: nowrap;"><!-- The color attribute is applied here, but the background-color is missing even though it can use it --><spanstyle="color:red;" class="edgeLabel">It's the missing link!</span></div></foreignObject>
Steps to reproduce
Replicate the example graph definition above in a mermaid compatible editor
View the rendered workflow
Observe that the connector text label background retains the default color from the .edgeLink CSS class
Screenshots
Screenshot showing rendered connector with background-color attribute ignored
Screenshot showing rendered HTML with color attribute applied but no background-color attribute.
Given that the path element does not have a background-color style attribute, I would expect the background-color attribute to be forwarded to the .edgeLabel node along with the color attribute.
Additional Context
No response
The text was updated successfully, but these errors were encountered:
In fact, I'd argue that anything other than a fill, stroke, and stroke-width style attribute in a linkStyle definition should be forwarded to the edgeLabel node since those are the only three style attributes a path element respects.
Description
I would expect the following code to render the connector line in green, the label in red, and the label background in blue:
In the rendered HTML, the
color
attribute is forwarded to the.edgeLabel
node and applied as an inline style, thus overriding the defaultedgeSpan
class color. However, thebackground-color
attribute is added to the connectorpath
node inline style, even thoughpath
elements do not have abackground-color
style, only afill
style. I would expect thebackground-color
attribute to be forwarded to the.edgeLabel
node along with thecolor
.Steps to reproduce
.edgeLink
CSS classScreenshots
Screenshot showing rendered connector with background-color attribute ignored
Screenshot showing rendered HTML with color attribute applied but no background-color attribute.
Code Sample
Example in live editor
Setup
Suggested Solutions
Given that the
path
element does not have a background-color style attribute, I would expect thebackground-color
attribute to be forwarded to the.edgeLabel
node along with thecolor
attribute.Additional Context
No response
The text was updated successfully, but these errors were encountered: