johnfactotum / foliate

Read e-books in style
https://johnfactotum.github.io/foliate/
GNU General Public License v3.0
5.25k stars 254 forks source link

syntax highlighting of code blocks only works for default theme #1315

Open nylki opened 1 month ago

nylki commented 1 month ago

Describe the bug Code blocks (monospace blocks with syntax highlighting) don't work for most themes, only the default theme.

To Reproduce Steps to reproduce the behavior:

  1. open an ePub that has a code block with syntax highlighting
  2. Click on "Fonts and Layout" (settings top right)
  3. click on "Colors" (tab bar item)
  4. Select a different color theme (other than default)
  5. code block is not syntax highlighted anymore, using the same font color as the regular text

Expected behavior When changing the color theme I expect syntax highlight of code blocks to still be visible.

Screenshots default theme, featuring syntax highlighting and different bg-color: Bildschirmfoto vom 2024-05-14 20-18-47

solarized (or sepia) theme without syntax highlighting and same bg-color: Bildschirmfoto vom 2024-05-14 20-19-08

Version:

johnfactotum commented 1 month ago

This is a feature to ensure that the text is legible. I think this is also the behavior in Apple Books and Readium/Thorium.

I suppose the easiest way out would be to just add an option to disable this.

nylki commented 1 month ago

This is a feature to ensure that the text is legible. I think this is also the behavior in Apple Books and Readium/Thorium.

I suppose the easiest way out would be to just add an option to disable this.

Thank you for your quick response! Just to avoid confusion: Is my assumption correct that the non-default themes don't have a code-block specific stylesheet that would fit their color scheme? (so they are colored as if they are plaintext).

johnfactotum commented 1 month ago

The syntax highlighting is part of the stylesheet of the EPUB file. Most EPUB files are designed to be displayed on a white background only and look broken when you apply a custom theme. So when using non-white background, Foliate overrides all foreground and background colors so that the theme would be applied consistently and the text would remain readable. See 29eed7e6dbd114cc095aee3efe93ece24a4a399c.

nylki commented 1 month ago

@johnfactotum Thanks for explaining, makes way more sense now :slightly_smiling_face: ! I did not know that the syntax coloring is baked into the EPUB itself. I was hoping that code blocks were somehow defined in a more generic way in EPUB (like a <code></code>-block), so that applying a syntax theme would be relatively easy.

I wonder if it would be feasible to heuristically identify code blocks and then define a custom theme for those section.

Anyways, feel free to close the issue if you like.

johnfactotum commented 1 month ago

Yes, the code should be marked up with the <code> element. However, to quote the HTML Standard:

There is no formal way to indicate the language of computer code being marked up.

So automatically applying syntax highlighting would be problematic.

nylki commented 1 month ago

I see. So, just to entertain the idea: although there is no formal way, auto-detection of the language inside a block could be an option (perhaps as an option that is disabled by default, or more involved, via a button to change the detected language). For example highlight.js does supports auto-detection of languages.

johnfactotum commented 1 month ago

Yes, that would be possible in theory, but probably too localized and complicated to be ever implemented in Foliate itself.

Some alternatives, when the book already has syntax highlighting, which most of them do, are