public/Boostnote
1
0
Fork 0
mirror of https://github.com/BoostIo/Boostnote synced 2025-12-13 09:46:22 +00:00
Code Issues Releases Wiki Activity

Merge pull request #2231 from yougotwill/mermaid_dark_theme_fix

Browse Source 
Mermaid dark theme rendering fix
This commit is contained in:
Junyoung Choi (Sai)
2018-08-09 17:54:54 +09:00
committed by GitHub
parent cfe3cae88d 16c62cd46f
commit 5aae9a4722
2 changed files with 13 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
browser/components/MarkdownPreview.js
View File

@@ -554,7 +554,7 @@ export default class MarkdownPreview extends React.Component {
_.forEach(
this.refs.root.contentWindow.document.querySelectorAll('.mermaid'),
(el) => {
mermaidRender(el, htmlTextHelper.decodeEntities(el.innerHTML))
mermaidRender(el, htmlTextHelper.decodeEntities(el.innerHTML), theme)
}
)
}

13
browser/components/render/MermaidRender.js
View File

@@ -1,5 +1,11 @@
import mermaidAPI from 'mermaid'
// fixes bad styling in the mermaid dark theme
const darkThemeStyling = `
.loopText tspan {
fill: white;
}`
function getRandomInt (min, max) {
return Math.floor(Math.random() * (max - min)) + min
}
@@ -13,8 +19,13 @@ function getId () {
return id
}
function render (element, content) {
function render (element, content, theme) {
try {
let isDarkTheme = theme === 'dark' || theme === 'solarized-dark' || theme === 'monokai'
mermaidAPI.initialize({
theme: isDarkTheme ? 'dark' : 'default',
themeCSS: isDarkTheme ? darkThemeStyling : ''
})
mermaidAPI.render(getId(), content, (svgGraph) => {
element.innerHTML = svgGraph
})