flowchart/mermaid: remove the surrounding pre

This commit is contained in:
Le Tan 2018-03-16 21:38:25 +08:00
parent 47b4cc88aa
commit dfbb692b15
5 changed files with 6 additions and 29 deletions

View File

@ -536,8 +536,7 @@ var renderMermaidOne = function(code) {
graphDiv.classList.add(VMermaidDivClass);
graphDiv.innerHTML = graph;
var preNode = code.parentNode;
preNode.classList.add(VMermaidDivClass);
preNode.replaceChild(graphDiv, code);
preNode.parentNode.replaceChild(graphDiv, preNode);
return true;
};
@ -582,19 +581,19 @@ var renderFlowchartOne = function(code) {
graphDiv.id = 'flowchart-diagram-' + flowchartIdx;
graphDiv.classList.add(VFlowchartDivClass);
var preNode = code.parentNode;
preNode.replaceChild(graphDiv, code);
var preParentNode = preNode.parentNode;
preParentNode.replaceChild(graphDiv, preNode);
// Draw on it after adding it to page.
try {
graph.drawSVG(graphDiv.id);
} catch (err) {
content.setLog("err: " + err);
preNode.replaceChild(code, graphDiv);
preParentNode.replaceChild(preNode, graphDiv);
delete graphDiv;
return false;
}
preNode.classList.add(VMermaidDivClass);
return true;
};

View File

@ -169,20 +169,12 @@ div.mermaid-diagram {
color: #6C6C6C;
}
pre.mermaid-diagram {
overflow-y: hidden;
}
div.flowchart-diagram {
overflow-y: hidden;
background: #B0BEC5;
color: #6C6C6C;
}
pre.flowchart-diagram {
overflow-y: hidden;
}
.img-package {
text-align: center;
}

View File

@ -173,18 +173,10 @@ div.mermaid-diagram {
overflow-y: hidden;
}
pre.mermaid-diagram {
overflow-y: hidden;
}
div.flowchart-diagram {
overflow-y: hidden;
}
pre.flowchart-diagram {
overflow-y: hidden;
}
.img-package {
text-align: center;
}

View File

@ -172,18 +172,10 @@ div.mermaid-diagram {
overflow-y: hidden;
}
pre.mermaid-diagram {
overflow-y: hidden;
}
div.flowchart-diagram {
overflow-y: hidden;
}
pre.flowchart-diagram {
overflow-y: hidden;
}
.img-package {
text-align: center;
}

View File

@ -126,6 +126,8 @@ QString VNote::generateHtmlTemplate(const QString &p_renderBg,
"pre code { white-space: pre-wrap !important; "
"word-break: break-all !important; }\n"
"code { word-break: break-all !important; }\n"
"div.flowchart-diagram { overflow: hidden !important; }\n"
"div.mermaid-diagram { overflow: hidden !important; }\n"
"a { word-break: break-all !important; }\n";
if (!g_config->getEnableImageConstraint()) {
// Constain the image width by force in PDF, otherwise, the PDF will