Colorize code blocks

[AltarBeastiful]

Code blocks seem to be properly styled using <code class="language-xxx"> but not color are shown in the final PDF. Also the code block could be more outlined like the azure devops wiki style :

[MaxMelcher]

Have you checked the generated html - potentially this is just a styling issue.

[Jheronymus]

markdown code blocks are indeed converted to <pre><code class="language-name"></code></pre> in the devopswikistyle.css file there is styling for this. However, this does not do code highlighting. It only styles the block itself.

If you want individual keyword to look different, they need to have a span tag with a class. Also on DevOps there is a service running that does this. It adds the correct span tags with the applicable styling.

A quick google leads you to https://highlightjs.org/ perhaps there are more out there that can be used readily.

[MaxMelcher]

I used highlightjs - it’s JavaScript and a Stylesheet similar to the mermaid and latex thing we already have in place…

Putting it on the list

Get Outlook for iOShttps://aka.ms/o0ukef

---

From: Jeroen @.> Sent: Thursday, July 15, 2021 10:50:48 PM To: MaxMelcher/AzureDevOps.WikiPDFExport @.> Cc: Max Melcher @.>; Comment @.> Subject: Re: [MaxMelcher/AzureDevOps.WikiPDFExport] Colorize code blocks (#73)

markdown code blocks are indeed converted to

in the devopswikistyle.css file there is styling for this. However, this does not do code highlighting. It only styles the block itself.

If you want individual keyword to look different, they need to have a span tag with a class. Also on DevOps there is a service running that does this. It adds the correct span tags with the applicable styling.

A quick google leads you to https://highlightjs.org/ perhaps there are more out there that can be used readily.

— You are receiving this because you commented. Reply to this email directly, view it on GitHubhttps://github.com/MaxMelcher/AzureDevOps.WikiPDFExport/issues/73#issuecomment-881004426, or unsubscribehttps://github.com/notifications/unsubscribe-auth/AAH3LN5GXXAWLFQO7EXCKHLTX5C2RANCNFSM5AOFWNXA.

[AltarBeastiful]

Just added a PR adding highlight-js that fixes my issue.

Also my first issue with the code blocks appearing white was because of a styling issue. The --css parameter actually replaces the default css. To fix it, I copied the content of devopswikistyle.css at the beginning of my custom css file.