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

add attributes to fence blocks

Browse Source
This commit is contained in:
Baptiste Augrain
2018-09-13 11:07:19 +02:00
parent e2957192d0
commit 189b245b1d
5 changed files with 207 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -2,8 +2,8 @@ import mermaidAPI from 'mermaid'
// fixes bad styling in the mermaid dark theme
const darkThemeStyling = `
.loopText tspan {
fill: white;
.loopText tspan {
fill: white;
}`
function getRandomInt (min, max) {
@@ -11,9 +11,9 @@ function getRandomInt (min, max) {
}
function getId () {
var pool = 'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789'
var id = 'm-'
for (var i = 0; i < 7; i++) {
const pool = 'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789'
let id = 'm-'
for (let i = 0; i < 7; i++) {
id += pool[getRandomInt(0, 16)]
}
return id
@@ -21,14 +21,18 @@ function getId () {
function render (element, content, theme) {
try {
const height = element.attributes.getNamedItem('data-height')
if (height && height.value !== 'undefined') {
element.style.height = height.value + 'vh'
}
let isDarkTheme = theme === 'dark' || theme === 'solarized-dark' || theme === 'monokai'
mermaidAPI.initialize({
theme: isDarkTheme ? 'dark' : 'default',
themeCSS: isDarkTheme ? darkThemeStyling : ''
themeCSS: isDarkTheme ? darkThemeStyling : '',
useMaxWidth: false
})
mermaidAPI.render(getId(), content, (svgGraph) => {
element.innerHTML = svgGraph
element.style.height = element.attributes.getNamedItem('data-height').value + 'vh'
})
} catch (e) {
console.error(e)