Merge pull request #1126 from mermaid-js/bug/935_styling_of_dotted_th…

…ink_links #935 Fix for stylink of links. Default theme colors are picked up and…
mermaid-js · Dec 8, 2019 · d8251c8 · d8251c8
2 parents ddf8016 + d23ce9f
commit d8251c8
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 6 deletions.
diff --git a/cypress/platform/current.html b/cypress/platform/current.html
@@ -4,22 +4,31 @@
       href="https://fonts.googleapis.com/css?family=Montserrat&display=swap"
       rel="stylesheet"
     />
+    <style>
+      body {background: black}
+      h1 { color: white;}
+      .arrowheadPath {fill: red;}
 
+      .edgePath .path {stroke: red;}
+
+
+    </style>
   </head>
   <body>
     <h1>info below</h1>
     <div style="display: flex;">
       <div class="mermaid">graph TD
-        A["a=b &&</b>"]
-        A["a=b && a>b</b>"]
+        A ==> B
+        A --> C
+        A -.-> D
       </div>
 </div>
   <script src="./mermaid.js"></script>
     <script>
       mermaid.initialize({
-        theme: 'forest',
+        theme: 'dark',
         // arrowMarkerAbsolute: true,
-        // themeCSS: '.node rect { fill: red; }',
+        // themeCSS: '.edgePath .path {stroke: red;} .arrowheadPath {fill: red;}',
         logLevel: 3,
         flowchart: { curve: 'linear', "htmlLabels": false },
         gantt: { axisFormat: '%m/%d/%Y' },

diff --git a/src/diagrams/flowchart/flowRenderer.js b/src/diagrams/flowchart/flowRenderer.js
@@ -213,10 +213,10 @@ export const addEdges = function(edges, g) {
           }
           break;
         case 'dotted':
-          style = 'stroke: #333; fill:none;stroke-width:2px;stroke-dasharray:3;';
+          style = 'fill:none;stroke-width:2px;stroke-dasharray:3;';
           break;
         case 'thick':
-          style = 'stroke: #333; stroke-width: 3.5px;fill:none';
+          style = ' stroke-width: 3.5px;fill:none';
           break;
       }
     }