dark theme fixes

src/themes/dark/index.scss

@@ -1,7 +1,7 @@
 $mainBkg: #1f2020;
 $secondBkg: lighten(#1f2020, 16);
 $mainContrastColor: lightgrey;
-$darkTextColor: #323D47;
+$darkTextColor: #fefefe;
 $lineColor: $mainContrastColor;
 $border1: #81B1DB;
 $border2: rgba(255, 255, 255, 0.25);
@@ -58,7 +58,7 @@ $taskTextDarkColor: $darkTextColor;
 $todayLineColor: #DB5757;
 
 /* state colors */
-$labelColor: black;
+$labelColor: #f4f4f4;
 
 $errorBkgColor: #a44141;
 $errorTextColor: #ddd;

src/themes/flowchart.scss

@@ -5,7 +5,7 @@
 }
 
 .label text {
-  fill: #333;
+  fill: $titleColor;
 }
 
 .node rect,
@@ -20,6 +20,7 @@
 
 .node .label {
   text-align: center;
+  fill: $titleColor;
 }
 .node.clickable {
   cursor: pointer;
@@ -42,7 +43,7 @@
 .edgeLabel {
   background-color: $edgeLabelBackground;
   rect {
-    opacity: 0.5;
+    opacity: 0.3;
   }
   text-align: center;
 }

src/themes/state.scss

@@ -7,10 +7,14 @@ g.stateGroup text {
 }
 g.stateGroup text {
   fill: $nodeBorder;
+  fill: $titleColor;
   stroke: none;
   font-size: 10px;
 
 }
+g.statediagram-cluster .cluster-label text {
+  fill: $titleColor;
+}
 g.stateGroup .state-title {
   font-weight: bolder;
   fill: $labelColor;
@@ -57,7 +61,11 @@ g.stateGroup line {
   stroke: none;
   stroke-width: 0;
   fill: $nodeBkg;
-  opacity: 0.5;
+  opacity: 0.7;
+}
+
+.edgeLabel text {
+  fill: #333;
 }
 
 .stateLabel text {