mirror of
https://github.com/thangisme/notes.git
synced 2024-11-09 07:27:35 -05:00
34 lines
1.3 KiB
HTML
34 lines
1.3 KiB
HTML
|
{% comment -%}
|
||
|
Fixes the HTML for highlighted code with linenos.
|
||
|
|
||
|
Derived from the workaround provided by Dmitry Hrabrov (DeXP) at
|
||
|
https://github.com/penibelst/jekyll-compress-html/issues/71#issuecomment-188144901
|
||
|
|
||
|
Explanation:
|
||
|
|
||
|
The HTML produced by Rouge with the linenos option matches CSS `code table`.
|
||
|
Jekyll (<= 4.1.1) always wraps the highlighted HTML with `pre`, which is
|
||
|
unnecessary and non-conforming, and leads to validation error reports.
|
||
|
The fix removes the `pre` tags around `_code` whenever it contains the pattern
|
||
|
`<table class="rouge-table">`. This change avoids validation errors, and
|
||
|
allows the use of [Jekyll layout for compressing HTML](http://jch.penibelst.de),
|
||
|
which relies on `pre` tags not being nested.
|
||
|
|
||
|
Usage:
|
||
|
|
||
|
{% capture fix_linenos_code %}{% highlight AnyLanguage linenos %}
|
||
|
Some code
|
||
|
{% endhighlight %}{% endcapture %}{% include fix_linenos.html %}{{ fix_linenos_code }}
|
||
|
|
||
|
Caveats:
|
||
|
|
||
|
The above does not work when `Some code` happens to contain the matched string
|
||
|
`<table class="rouge-table">`.
|
||
|
|
||
|
{%- endcomment %}
|
||
|
|
||
|
{% if fix_linenos_code contains '<table class="rouge-table">' %}
|
||
|
{% assign fix_linenos_code = fix_linenos_code | replace: "<pre><code", "<code" %}
|
||
|
{% assign fix_linenos_code = fix_linenos_code | replace: "</code></pre>", "</code>" %}
|
||
|
{% endif %}
|