add parameter to specify the height of the diagram, fixing BoostIO#2335

daiyam · Aug 25, 2018 · a591001 · a591001
1 parent 039f737
commit a591001
Show file tree

Hide file tree

Showing 3 changed files with 7 additions and 2 deletions.
diff --git a/browser/components/render/MermaidRender.js b/browser/components/render/MermaidRender.js
@@ -28,6 +28,7 @@ function render (element, content, theme) {
     })
     mermaidAPI.render(getId(), content, (svgGraph) => {
       element.innerHTML = svgGraph
+      element.style.height = element.attributes.getNamedItem('data-height').value + 'vh'
     })
   } catch (e) {
     console.error(e)

diff --git a/browser/lib/markdown.js b/browser/lib/markdown.js
@@ -44,7 +44,7 @@ class Markdown {
           return `<pre class="chart">${str}</pre>`
         }
         if (langType === 'mermaid') {
-          return `<pre class="mermaid">${str}</pre>`
+          return `<pre class="mermaid" data-height="${fileName}">${str}</pre>`
         }
         return '<pre class="code CodeMirror">' +
           '<span class="filename">' + fileName + '</span>' +

diff --git a/browser/styles/index.styl b/browser/styles/index.styl
@@ -383,4 +383,8 @@ modalmonokai()
   width 100%
   background-color $ui-monokai-backgroundColor
   overflow hidden
-  border-radius $modal-border-radius
+  border-radius $modal-border-radius
+
+pre.mermaid svg {
+  max-width 100% !important
+}