From dffb6604dd39b0deae5206c07dc9f095ebb2fdc0 Mon Sep 17 00:00:00 2001
From: Tom Moor <tom.moor@gmail.com>
Date: Tue, 16 Apr 2024 22:21:28 -0400
Subject: [PATCH] fix: Mermaid diagram styling in exported HTML/PDF

closes #6726
---
 shared/editor/components/Styles.ts | 17 +++++++++++------
 1 file changed, 11 insertions(+), 6 deletions(-)

diff --git a/shared/editor/components/Styles.ts b/shared/editor/components/Styles.ts
index c4de26710..8163a1fd7 100644
--- a/shared/editor/components/Styles.ts
+++ b/shared/editor/components/Styles.ts
@@ -1146,11 +1146,16 @@ mark {
 .code-block[data-language=mermaidjs] {
   margin: 0.75em 0;
 
-  pre {
-    border-bottom-left-radius: 0;
-    border-bottom-right-radius: 0;
-    margin-bottom: -20px;
-    overflow: hidden;
+  ${
+    !props.staticHTML &&
+    css`
+      pre {
+        border-bottom-left-radius: 0;
+        border-bottom-right-radius: 0;
+        margin-bottom: -20px;
+        overflow: hidden;
+      }
+    `
   }
 
   // Hide code without display none so toolbar can still be positioned against it
@@ -1160,7 +1165,7 @@ mark {
     overflow: hidden;
 
     // Allows the margin to collapse correctly by moving div out of the flow
-    position: absolute;
+    position: ${props.staticHTML ? "relative" : "absolute"};
   }
 }