From 7763d9ceb880d103b3a9fb77a7ee256b90483c84 Mon Sep 17 00:00:00 2001
From: Knut Sveidqvist <knsv@sveido.com>
Date: Tue, 11 Jun 2024 15:03:14 +0200
Subject: [PATCH] 5237 Label background for state diagrams

---
 packages/mermaid/src/diagrams/state/styles.js | 9 +++++++++
 packages/mermaid/src/themes/theme-default.js  | 2 +-
 2 files changed, 10 insertions(+), 1 deletion(-)

diff --git a/packages/mermaid/src/diagrams/state/styles.js b/packages/mermaid/src/diagrams/state/styles.js
index fe3d7078b..e2a70ffec 100644
--- a/packages/mermaid/src/diagrams/state/styles.js
+++ b/packages/mermaid/src/diagrams/state/styles.js
@@ -68,6 +68,15 @@ g.stateGroup line {
   fill: ${options.labelBackgroundColor};
   opacity: 0.5;
 }
+.edgeLabel {
+  background-color: ${options.edgeLabelBackground};
+  rect {
+    opacity: 0.5;
+    background-color: ${options.edgeLabelBackground};
+    fill: ${options.edgeLabelBackground};
+  }
+  text-align: center;
+}
 .edgeLabel .label text {
   fill: ${options.transitionLabelColor || options.tertiaryTextColor};
 }
diff --git a/packages/mermaid/src/themes/theme-default.js b/packages/mermaid/src/themes/theme-default.js
index d95ccf59e..dea1a6163 100644
--- a/packages/mermaid/src/themes/theme-default.js
+++ b/packages/mermaid/src/themes/theme-default.js
@@ -34,7 +34,7 @@ class Theme {
     this.arrowheadColor = '#333333';
     this.fontFamily = '"trebuchet ms", verdana, arial, sans-serif';
     this.fontSize = '16px';
-    this.labelBackground = '#e8e8e8';
+    this.labelBackground = 'rgba(232,232,232,0.6)';
     this.textColor = '#333';
     this.THEME_COLOR_LIMIT = 12;