Ori*_*rds 13 markdown github mermaid
我使用 Mermaid 图作为 GitHub 上 Markdown 文件的一部分。这样做的一个副作用是我无法访问 javascript,否则我可以用它来解决问题。
MermaidJS主题系统允许您在图表定义中内联指定自定义主题,如下所示:
%%{
init: {
'theme': 'base',
'themeVariables': {
'primaryColor': '#93D0FF',
'primaryTextColor': '#000'
}
}
}%%
flowchart TD;
queue[Queue] -- Query for Items --> db[(Database)]
db --> queue
queue -- Found Item --> process[Process Item]
Run Code Online (Sandbox Code Playgroud)
这非常有效,只是颜色是硬编码的,而且我发现在深色模式下使用浏览器时,图表会设置为深色背景,并且某些部分变得不可读。
美人鱼具有“深色模式支持”,如果我根本不指定任何自定义主题,那么当浏览器处于深色模式时,它会自动选择深色模式兼容的主题。然而,默认的“灯光模式”美人鱼主题很丑,所以这不是一个很好的解决方案。
我想做的是这样的
%%{
init: {
'theme': 'base',
'themeVariables': {
'primaryColor': '#93D0FF',
'primaryTextColor': (darkMode ? '#fff' : '#000')
}
}
}%%
flowchart...
Run Code Online (Sandbox Code Playgroud)
然而,文档没有提及任何有关内部动态计算的内容themeVariables
,并且我上面对三元运算符的尝试不起作用。
是否可以计算值,或以其他方式更改内联主题,使其在浅色和深色模式下工作,在 GitHub 等 JavaScript 不可用的环境中?
注意:mermaidjs 主题文档说有一个名为 的变量background
。我尝试将其设置为强制背景颜色为白色(试图“选择退出”深色模式),但这也不起作用。