Skip to content

GitHub light and dark style don't match, thus non-usable for dual theme sites. #1239

@bryndin

Description

@bryndin

Is there an existing issue for this?

  • I have searched the existing issues

Describe the bug

TL;DR: This bug is similar to: #786

Styles for GitHub light and dark themes aren't matching:

For the light/dark theme to be usable, the tags have to match 100%.

Problem: The light one has NameOther and the dark one does not:
https://github.com/alecthomas/chroma/blob/master/styles/github.xml#L16

I use Hugo site builder (https://gohugo.io/) that uses Chroma for syntax highlighting.
Light render:
Image

Dark render:
Image

/* NameOther */ .chroma .nx { color:#1f2328 } is lacking.

Sample HTML code.

<div class="chroma">
<table class="lntable"><tbody><tr><td class="lntd">
<pre tabindex="0" class="chroma"><code><span class="lnt">1
</span></code></pre></td>
<td class="lntd">
<pre tabindex="0" class="chroma"><code class="language-javascript" data-lang="javascript"><span class="line"><span class="cl"><span class="nx">console</span><span class="p">.</span><span class="nx">log</span><span class="p">(</span><span class="s2">"Hello, World!"</span><span class="p">);</span>
</span></span></code></pre></td></tr></tbody></table>
</div>

To Reproduce

github
https://swapoff.org/chroma/playground/#eyJsYW5ndWFnZSI6IkphdmFTY3JpcHQiLCJzdHlsZSI6ImdpdGh1YiIsInRleHQiOiJjb25zb2xlLmxvZyhcIkhlbGxvLCBXb3JsZCFcIik7IiwiY2xhc3NlcyI6ZmFsc2V9

github-dark
https://swapoff.org/chroma/playground/#eyJsYW5ndWFnZSI6IkphdmFTY3JpcHQiLCJzdHlsZSI6ImdpdGh1Yi1kYXJrIiwidGV4dCI6ImNvbnNvbGUubG9nKFwiSGVsbG8sIFdvcmxkIVwiKTsiLCJjbGFzc2VzIjpmYWxzZX0

Note: class="nx" is not defined for the github-dark, when you look at the HTML

Metadata

Metadata

Assignees

No one assigned

    Labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions