Adding option for custom theme #24
Conversation
| @@ -76,5 +75,6 @@ Usage: mmdc [options] | |||
| -b, --backgroundColor [backgroundColor] Background color. Example: transparent, red, '#F0F0F0'. Optional. Default: white | |||
| -c, --configFile [config] JSON configuration file for mermaid. Optional | |||
| -C, --cssFile [cssFile] CSS alternate file for mermaid. Optional | |||
| -T, --customTheme <customThemeCssFile> CSS file replacing CSS injected into SVG container. Optional | |||
There was a problem hiding this comment.
Not saying <...> is wrong but maybe [customThemeCssFile] for consistency?
There was a problem hiding this comment.
Yea - I was weighing consistency over correctness here. If you use the <...> version, then commander stops the run and reports the missing option. My inclination was to change all the others to <...> but that seemed presumptuous to do as part of my change.
That said, I'm fine with switching to the [...] version if you like. I'd just want to make sure that the application handles a missing file name gracefully.
There was a problem hiding this comment.
FYI - I just tested using one of the existing options. As it stands, if you just specify one of the options which expects a file but don't provide one, you get this.
$ node index.js -C -i test/flowchart.mmd
CSS file "true" doesn't exist
There was a problem hiding this comment.
I'm with you regarding changing all, @tylerlong is the developer I just proposed a couple improvements like you did.
There was a problem hiding this comment.
OK - I've included that in this PR now as well.
There was a problem hiding this comment.
I don't get the point. If you specify -C, you should specify a CSS file such as -C ./test/index.css.
There was a problem hiding this comment.
I don't have any issue with the current commander code. You can omit any options except those marked as required. So I probably won't change this part.
|
I like it! This will allow me to work-around mermaid-js/mermaid#587 |
…an option is used.
|
For the custom theme thing. I prefer to do it in mermaid instead of doing it in a hacky way in this project. I will leave this PR open for now. Thank you very much for your PR! |
|
This feature is supported in mermaid. Usage: https://github.com/mermaidjs/mermaid.cli/blob/master/test/config.json#L14 "theme": "forest",
"themeCSS": ".node rect { fill: red; }"So the Or you could: "theme": null,
"themeCSS": "<CSS for your theme>"to disable pre-defined mermaid theme. |
|
I color the link but arrow sign did not color |
|
Can we remove the custom CSS file, then? Does that option work at all? Also, it would be ideal if we didn't have to place our styles in a string, but had a file we could refer to. |
OK - per the discussion on issue #18 , here is the PR which adds a new -T / --customTheme option to the CLI which will fully replace the contents of the style element in the SVG tag. I also added a slightly modified version of the base mermaid.css file so that the effect of new option can be seen.
Ideally, the base mermaid config would allow this, but I checked the code and it does not support using anything but the built-in themes via the JSON config file.