Trek syntax highlighting gelijk tussen Markdown en <Canvas>

[hidde]

fixes #394

Er zat verschil tussen syntax highlighting in code die:

• in Markdown code blocks (met ```) was toegevoegd
• in codevoorbeelden op een <Canvas>

Met deze PR worden die gelijk getrokken, namelijk beide in de kleuren die al in de Canvas zaten (want voldoet aan WCAG). Dit introduceert wel wat ongelukkige herhalingen.

Wat uitleg:

• de Markdown-rendering van Docusaurus kon ik in de Docusaurusconfig aanpassen (relevante docs), maar dat theme.styles had de styles in een ander formaat nodig dan we reeds in PrismStyle.ts hadden leven.
• ik heb een lading styles op code / pre + de syntax highlighting related custom properties verhozen van Canvas naar custom.css, zodat ze werken voor alle codeblokken, inclusief die die niet in een Canvas zitten; deze bestaan ook nog in PrismStyle.ts, omdat die anders worden overschreven door andere inline styles
• aanpassing in PrismStyle.ts is fix: we misten daar -- in de syntax

---

Ter illustratie,

voor:

na:

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
documentatie	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Nov 27, 2023 1:57pm

[rianrietveld]

@hidde Het zit er goed uit, qua frontend (als je al die inline CSS meuk niet meetelt, want echt... bah).
Ik laat het aan Yolijn om te bekijken of het goed in het systeem past.

[rianrietveld]

@hidde LGTM 👍

[Yolijn]

Hmm goed dat de pre er nu hetzelfde uit ziet, maar jammer dat daarvoor alles nu in custom.css moet staan. Ik hoop dat we binnenkort tijd hebben om de boel eens even goed in elkaar te draaien, maar voor nu ok

[hidde]

Had de overweging gemaakt tussen iets viezere custom.css of (arguably) iets viezere Markdownbestanden (bv als styles netjes aan een component hangen maar dan wel dat component z'n weg naar alle pre's moet vinden), dit leek me zo het mooiste (maar misschien zie ik een derde oplossing over het hoofd).