markdown-nice icon indicating copy to clipboard operation
markdown-nice copied to clipboard

微信在暗黑模式下align环境中的多行公式依然显示为黑色

Open Shyujikou opened this issue 5 years ago • 6 comments

运行环境:

操作系统 浏览器
macOS Chrome

Markdown文本内容:

例如:

$$
\begin{aligned}
100 \bmod 3=1 \\
10 \bmod 3=1 \\
1 \bmod 3=1
\end{aligned}
$$

错误详情:

在微信暗黑模式下,公众号里的一般LaTeX公式会自动显示为白色,但是在align环境中的多行公式(如上面的代码这样的)依然显示为黑色,不会自动随着暗黑模式改变文字颜色,导致在暗黑模式下这些公式看不见,效果看下图:

暗黑模式的公式问题

Shyujikou avatar Jul 14 '20 11:07 Shyujikou

目前还没做暗黑模式适配

guanpengchn avatar Jul 14 '20 12:07 guanpengchn

目前还没做暗黑模式适配

关于暗黑模式适配暂时还没发现其他方面问题,只有这种公式好像不太行。。。

Shyujikou avatar Jul 14 '20 12:07 Shyujikou

经过仔细研究,我发现了这个问题的原因。

首先,mdnice生成的所有公式的SVG代码中都包含fill="currentColor"属性,这个属性可以让SVG继承当前color属性的设置,也就是会跟随正文颜色而改变颜色,这也是为什么通常情况下公式在暗黑模式下都是正常的。

但是,通过Google的Developer Tools观察会发现,多行公式在粘贴到公众号编辑器里面之后,会被替换成一个<embed>标签,而不是行内SVG代码,可以对比一下。

这个是普通单行公式,是行内SVG代码:

普通公式

这个是多行公式,变成了<embed>外链一个外部SVG文档:

多行公式

如果是外链的话,那么fill="currentColor"就不起作用了,于是公式颜色不会跟随正文变化,也就导致了这个适配问题。

如果我在Developer Tools里面把这段<embed>强行替换为行内SVG代码,问题就解决了。

但是我不知道是什么原因触发了微信会将多行公式的SVG变成外链,是因为大小限制吗,还是其他原因?除了手工hack,mdnice这边是否有什么workaround可以做?谢谢。

Shyujikou avatar Aug 20 '20 01:08 Shyujikou

经过测试,使用Chrome插件直接注入的内容不会发生这个问题,而通过剪贴板复制粘贴的内容会,可能是因为Chrome插件可以直接向编辑器里注入代码,跳过了公众号编辑器的一些转换逻辑。

这样的话,这个就不是mdnice的bug了,但是希望作者可以在文档中做个提示,然后Close就好了,谢谢。

Shyujikou avatar Aug 20 '20 12:08 Shyujikou

经过测试,使用Chrome插件直接注入的内容不会发生这个问题,而通过剪贴板复制粘贴的内容会,可能是因为Chrome插件可以直接向编辑器里注入代码,跳过了公众号编辑器的一些转换逻辑。

@Shyujikou 你好,请问这里说的 Chrome插件 是指哪个插件?🙏

zyphs21 avatar Oct 23 '20 02:10 zyphs21

就是mdnice官方的插件,看官网或README都有提到吧。

在 2020年10月23日,10:05,Hanson Zhang [email protected] 写道:

 经过测试,使用Chrome插件直接注入的内容不会发生这个问题,而通过剪贴板复制粘贴的内容会,可能是因为Chrome插件可以直接向编辑器里注入代码,跳过了公众号编辑器的一些转换逻辑。

@Shyujikou 你好,请问这里说的 Chrome插件 是指哪个插件?🙏

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub, or unsubscribe.

Shyujikou avatar Oct 23 '20 02:10 Shyujikou