From cf49ec078179f52a6b293e1918922c0b0c3f33f5 Mon Sep 17 00:00:00 2001
From: Muhammad Tayyab
 <79717215+Muhammad-Tayyab-Bhutto@users.noreply.github.com>
Date: Fri, 20 Oct 2023 12:39:43 +0500
Subject: [PATCH] fix: Markdown strings break colour styling #4957

---
 cypress/integration/rendering/flowchart-elk.spec.js | 6 +++---
 cypress/integration/rendering/flowchart-v2.spec.js  | 6 +++---
 cypress/integration/rendering/flowchart.spec.js     | 2 +-
 docs/syntax/flowchart.md                            | 4 ++--
 4 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/cypress/integration/rendering/flowchart-elk.spec.js b/cypress/integration/rendering/flowchart-elk.spec.js
index 221806b073..c9fcf3ccc8 100644
--- a/cypress/integration/rendering/flowchart-elk.spec.js
+++ b/cypress/integration/rendering/flowchart-elk.spec.js
@@ -340,7 +340,7 @@ flowchart-elk TB
     flowchart-elk LR
     id1(Start)-->id2(Stop)
     style id1 fill:#f9f,stroke:#333,stroke-width:4px
-    style id2 fill:#bbf,stroke:#f66,stroke-width:2px,color:#fff,stroke-dasharray: 5 5
+    style id2 fill:#bbf,stroke:#f66,stroke-width:2px,color:#000000,stroke-dasharray: 5 5
       `,
       { htmlLabels: true, flowchart: { htmlLabels: true }, securityLevel: 'loose' }
     );
@@ -707,7 +707,7 @@ flowchart-elk LR
     A:::someclass --> B["\`The **cat** in the hat\`"]:::someclass
     id1(Start)-->id2(Stop)
     style id1 fill:#f9f,stroke:#333,stroke-width:4px
-    style id2 fill:#bbf,stroke:#f66,stroke-width:2px,color:#fff,stroke-dasharray: 5 5
+    style id2 fill:#bbf,stroke:#f66,stroke-width:2px,color:#000000,stroke-dasharray: 5 5
     classDef someclass fill:#f96
 `,
           { flowchart: { titleTopMargin: 0 } }
@@ -779,7 +779,7 @@ flowchart-elk LR
     A:::someclass --> B["\`The **cat** in the hat\`"]:::someclass
     id1(Start)-->id2(Stop)
     style id1 fill:#f9f,stroke:#333,stroke-width:4px
-    style id2 fill:#bbf,stroke:#f66,stroke-width:2px,color:#fff,stroke-dasharray: 5 5
+    style id2 fill:#bbf,stroke:#f66,stroke-width:2px,color:#000000,stroke-dasharray: 5 5
     classDef someclass fill:#f96
 `,
           { flowchart: { titleTopMargin: 0 } }
diff --git a/cypress/integration/rendering/flowchart-v2.spec.js b/cypress/integration/rendering/flowchart-v2.spec.js
index aac4a31b17..249a6a338a 100644
--- a/cypress/integration/rendering/flowchart-v2.spec.js
+++ b/cypress/integration/rendering/flowchart-v2.spec.js
@@ -330,7 +330,7 @@ flowchart TB
     flowchart LR
     id1(Start)-->id2(Stop)
     style id1 fill:#f9f,stroke:#333,stroke-width:4px
-    style id2 fill:#bbf,stroke:#f66,stroke-width:2px,color:#fff,stroke-dasharray: 5 5
+    style id2 fill:#bbf,stroke:#f66,stroke-width:2px,color:#000000,stroke-dasharray: 5 5
       `,
       { htmlLabels: true, flowchart: { htmlLabels: true }, securityLevel: 'loose' }
     );
@@ -738,7 +738,7 @@ flowchart LR
     A:::someclass --> B["\`The **cat** in the hat\`"]:::someclass
     id1(Start)-->id2(Stop)
     style id1 fill:#f9f,stroke:#333,stroke-width:4px
-    style id2 fill:#bbf,stroke:#f66,stroke-width:2px,color:#fff,stroke-dasharray: 5 5
+    style id2 fill:#bbf,stroke:#f66,stroke-width:2px,color:#000000,stroke-dasharray: 5 5
     classDef someclass fill:#f96
 `,
           { flowchart: { titleTopMargin: 0 } }
@@ -810,7 +810,7 @@ flowchart LR
     A:::someclass --> B["\`The **cat** in the hat\`"]:::someclass
     id1(Start)-->id2(Stop)
     style id1 fill:#f9f,stroke:#333,stroke-width:4px
-    style id2 fill:#bbf,stroke:#f66,stroke-width:2px,color:#fff,stroke-dasharray: 5 5
+    style id2 fill:#bbf,stroke:#f66,stroke-width:2px,color:#000000,stroke-dasharray: 5 5
     classDef someclass fill:#f96
 `,
           { flowchart: { titleTopMargin: 0 } }
diff --git a/cypress/integration/rendering/flowchart.spec.js b/cypress/integration/rendering/flowchart.spec.js
index e4766e7923..ef1d863feb 100644
--- a/cypress/integration/rendering/flowchart.spec.js
+++ b/cypress/integration/rendering/flowchart.spec.js
@@ -780,7 +780,7 @@ describe('Graph', () => {
     graph LR
     id1(Start)-->id2(Stop)
     style id1 fill:#f9f,stroke:#333,stroke-width:4px
-    style id2 fill:#bbf,stroke:#f66,stroke-width:2px,color:#fff,stroke-dasharray: 5 5
+    style id2 fill:#bbf,stroke:#f66,stroke-width:2px,color:#000000,stroke-dasharray: 5 5
       `,
       { htmlLabels: true, flowchart: { htmlLabels: true }, securityLevel: 'loose' }
     );
diff --git a/docs/syntax/flowchart.md b/docs/syntax/flowchart.md
index 1bdce6aa63..0938ddc830 100644
--- a/docs/syntax/flowchart.md
+++ b/docs/syntax/flowchart.md
@@ -988,14 +988,14 @@ It is possible to apply specific styles such as a thicker border or a different
 flowchart LR
     id1(Start)-->id2(Stop)
     style id1 fill:#f9f,stroke:#333,stroke-width:4px
-    style id2 fill:#bbf,stroke:#f66,stroke-width:2px,color:#fff,stroke-dasharray: 5 5
+    style id2 fill:#bbf,stroke:#f66,stroke-width:2px,color:#000000,stroke-dasharray: 5 5
 ```
 
 ```mermaid
 flowchart LR
     id1(Start)-->id2(Stop)
     style id1 fill:#f9f,stroke:#333,stroke-width:4px
-    style id2 fill:#bbf,stroke:#f66,stroke-width:2px,color:#fff,stroke-dasharray: 5 5
+    style id2 fill:#bbf,stroke:#f66,stroke-width:2px,color:#000000,stroke-dasharray: 5 5
 ```
 
 #### Classes