Fix mermaid flowchart margin issue (#27503)

Fixes: https://github.com/go-gitea/gitea/issues/27435
Related: https://github.com/mermaid-js/mermaid/issues/4907

<img width="924" alt="image"
src="https://github.com/go-gitea/gitea/assets/115237/494a1d2e-4c56-48d0-9843-82a5e5aa977e">

diff --git a/web_src/js/markup/mermaid.js b/web_src/js/markup/mermaid.js
index 865a414c93367e68996247346f8476502fd3ec67..84d88a94c3ddb99dccdf671f7ddc5b5e5ee34547 100644 (file)
--- a/web_src/js/markup/mermaid.js
+++ b/web_src/js/markup/mermaid.js
@@ -4,9 +4,11 @@ import {displayError} from './common.js';
 
 const {mermaidMaxSourceCharacters} = window.config;
 
+// margin removal is for https://github.com/mermaid-js/mermaid/issues/4907
 const iframeCss = `:root {color-scheme: normal}
 body {margin: 0; padding: 0; overflow: hidden}
-#mermaid {display: block; margin: 0 auto}`;
+#mermaid {display: block; margin: 0 auto}
+blockquote, dd, dl, figure, h1, h2, h3, h4, h5, h6, hr, p, pre {margin: 0}`;
 
 export async function renderMermaid() {
   const els = document.querySelectorAll('.markup code.language-mermaid');