mermaid-cli
mermaid-cli copied to clipboard
-C option for CSS file has no effect (part of potential fix included)
Describe the bug Using the -C option does not include that CSS into the written-out SVG file anywhere.
To Reproduce Steps to reproduce the behavior:
echo ".messageText { stroke: transparent !important }" > mermaid.css
../test/node_modules/.bin/mmdc -C mermaid.css -i diag.mmd
grep transparent diag.mmd.svg # finds nothing
Expected behavior
I expect <style>.messageText { stroke: transparent !important }</style>
to be in the SVG.
Desktop (please complete the following information):
- OS: OSX Catalina
Additional context Running puppeteer in headless mode, I don't see the SVG in the created document, either.
I did hack together a workaround for me, where the part that emits SVG now is:
const svg = yield page.$eval('#container', function (container) {
// new line is here; also, made the `style` variable in a higher scope, so can get to here
container.childNodes[0].appendChild(style);
return container.innerHTML;
});
I don't understand whether others find their CSS files are includes, or whether I'm doing anything wrong.
@joelburton : thank you so much for reporting this issue. Can you attach a .mmd file, css file and instructions to build the diagram? Would you be able to make a PR? I could validate your proposed solution there. Thanks! :)
To build:
~/src/node_modules/.bin/mmdc -i demo.mmd -C mermaid.css
check that file does not contain the CSS given
@font-face {
font-family: 'Source Han Sans SC';
font-style: normal;
font-weight: normal;
src: local('Source Han Sans SC'), local('SourceHanSansSC-Regular'),
url('SourceHanSansSC-Regular.otf') format('opentype');
}
html,
body {
font-family: 'Source Han Sans SC', Segoe UI, Roboto, PingFang SC, Hiragino Sans GB,
Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
font-size: 12px;
line-height: 1.5;
color: rgba(0, 0, 0, 0.65);
padding: 16px;
}
I use this css to specify a local font fail too