Add dark mode for test-(markdown|wiki)-render and pikchr commands

(1) By senyai on 2024-03-04 19:16:29 [source]

Hi! vscode-fossil extension has live preview of wiki and markdown formats. Alas, this plugin has white background hardcoded for pikchr images (.pikchr-svg {background-color: white;}). It is because you can't set dark theme with aforementioned commands. In these dark times an option to change the theme would lighten up my day. Thank you.

(2) By Stephan Beal (stephan) on 2024-03-05 08:19:49 in reply to 1 [link] [source]

It is because you can't set dark theme with aforementioned commands.

That's now done for the pikchr command:

$ cat foo.pikchr
line

$ ./fossil pikchr -dark foo.pikchr 
<svg ...>
<path ...  style="fill:none;stroke-width:2.16;stroke:rgb(255,255,255);" />
</svg>

$ ./fossil pikchr foo.pikchr 
<svg ...>
<path ...  style="fill:none;stroke-width:2.16;stroke:rgb(0,0,0);" />
</svg>

Note the different rgb() values.

Adding the same to the wiki/markdown rendering bits requires deeper changes, as those commands have no way of passing such a flag into the heart of the renderers. i have no estimate for when that will be done.

(3) By Stephan Beal (stephan) on 2024-03-05 08:45:21 in reply to 2 [link] [source]

Adding the same to the wiki/markdown rendering bits requires deeper changes, as those commands have no way of passing such a flag into the heart of the renderers.

It's arguably a bit of a hack, but it works:

$ cat foo.wiki
<verbatim type="pikchr">
line
</verbatim>

$ ./fossil test-wiki-render foo.wiki | grep rgb
<path d="M2.16,2.16L74.16,2.16"  style="fill:none;stroke-width:2.16;stroke:rgb(0,0,0);" />

$ ./fossil test-wiki-render -dark-pikchr foo.wiki | grep rgb
<path d="M2.16,2.16L74.16,2.16"  style="fill:none;stroke-width:2.16;stroke:rgb(255,255,255);" />

$ cat foo.md
~~~pikchr
line
~~~

$ ./fossil test-markdown-render foo.md | grep rgb
<path d="M2.16,2.16L74.16,2.16"  style="fill:none;stroke-width:2.16;stroke:rgb(0,0,0);" />

$ ./fossil test-markdown-render --dark-pikchr foo.md | grep rgb
<path d="M2.16,2.16L74.16,2.16"  style="fill:none;stroke-width:2.16;stroke:rgb(255,255,255);" />

That's now in trunk.

(4) By senyai on 2024-03-12 06:42:37 in reply to 3 [link] [source]

Thanks a lot. I will report back, when this flag is used in the extension.

(5) By senyai on 2024-04-01 08:45:40 in reply to 3 [link] [source]

fossil VSCode extension v0.5.5 was just released. It supports .wiki/.md/.pikchr rendering with --dark-pikchr argument depending on theme and fossil version. Thank you, @stephan, rendered documents look awesome. It could be better for the eye, if instead of black/white it was 'currentcolor', but that's a talk for another time.