moonwalk
moonwalk copied to clipboard
`.w` class conflicts with code whitespace
When formatting some languages, rouge will insert explicit whitespace spans, which use the exact same class as that on the main page body. This gives them a bunch of weird extra padding.
```json
no space
1 space
2 space
3 space
4 space
```
Becomes
<pre><span class="err">no</span><span class="w"> </span><span class="err">space</span><span class="w">
</span><span class="mi">1</span><span class="w"> </span><span class="err">space</span><span class="w">
</span><span class="mi">2</span><span class="w"> </span><span class="err">space</span><span class="w">
</span><span class="mi">3</span><span class="w"> </span><span class="err">space</span><span class="w">
</span><span class="mi">4</span><span class="w"> </span><span class="err">space</span><span class="w">
</span></pre>
The workaround I've got for now is:
.highlighter-rouge .w {
max-width: unset;
margin: unset;
padding: unset;
}