Dark Mode - Reading view turn text to unreadable

[FareziHanif]

In Source mode / live preview, the text is easily readable

In Preview Mode, the text turns white.

The text should turn black in preview mode since the highlighter is on the brighter colour. Im inserted the colour hex myself (copy paste from internet), if that causing this. Anyway, thank you to make such an eye pleasing plugins! Keep it up!~

[3dot141]

have some issue

[Comprehensive-Jason]

I have the same issue. For now, you can just add color: #000000 right after the semicolon in the inline CSS <mark style="background: #FFFFFF;"> to force the text color to black (for example <mark style="background: #FFFFFF; color: #000000">. It would be great if this was a built-in option in the plugin, so that we could select which font color to always use.

[Comprehensive-Jason]

I noticed that #22 is having the opposite problem. They want their text to be white always. Here https://github.com/chetachiezikeuzor/Highlightr-Plugin/issues/22#issuecomment-1047458790 they used a CSS snippet to force colors to always use the color of the theme. I messed with it, but it doesn't seem to work correctly anymore after the Obsidian 1.0 update due to the devs changing how some of the CSS classes work. It would be great if there was some kind of toggle in the plugin to select between these different behaviors by adding inline CSS like my comment above, so that our highlights are more robust and less fiddly.

[jx3v]

It would be great if the plugin could get updated to force white/default text color in editing mode.

[florenciagithub]

I personally prefer to work in dark mode with my font always white. I choose highlighter colours that make it still easy to read white fonts. And I wrote a snippet that makes the font always white, also when highlighted and with the editor mode on. The Highlighter colours that I use:

here is the code: / Setzt die Textfarbe für alle hervorgehobenen Elemente auf Weiß / .markdown-preview-view mark[class^="hltr-"], .cm-s-obsidian mark[class^="hltr-"] { color: #FFFFFF !important; }

⚠️ Make sure you switch the highlighting method to "css-classes" in the settings of the Highlightr plugin for the snippet to work its magic. Once you've done that, you'll see your text shining bright white over the colorful highlights – in both preview and editor mode!

I hope it helps anyone :) <3

[florenciagithub]

BUT it would be my dream if there was a "highlightr dark mode" version, where the font would be always white without the need to use a css snippet <3