thang/notes
1
0
Fork 0
mirror of https://github.com/thangisme/notes.git synced 2024-12-30 13:16:26 -05:00
Code Issues Projects Releases Wiki Activity

Simplified the use of fix_linenos

Browse Source 
Now using an include parameter.
Enhanced to support Markdown with code fences.
This commit is contained in:
PLanCompS 2020-07-06 15:07:53 +02:00
parent fdaf5a276b
commit b73300595b
1 changed files with 50 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

64
_includes/fix_linenos.html
View File

@ -1,33 +1,65 @@
{% comment -%}
Fixes the HTML for highlighted code with linenos.
{%- comment -%}
This file can be used to fix the HTML produced by Jekyll for highlighted
code with line numbers.
Derived from the workaround provided by Dmitry Hrabrov (DeXP) at
It works with `{% highlight some_language linenos %}...{% endhighlight %}`
and with the Kramdown option to add line numbers to fenced code.
The implementation was derived from the workaround provided by
Dmitry Hrabrov (DeXP) at
https://github.com/penibelst/jekyll-compress-html/issues/71#issuecomment-188144901
Explanation:
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.
The HTML produced by Rouge highlighting with lie numbers is of the form
`code table`. Jekyll (<= 4.1.1) always wraps the highlighted HTML
with `pre`. This wrapping is not only unnecessary, but also transforms
the conforming HTML produced by Rouge to non-conforming HTML, which
results in HTML validation error reports.
Usage:
The fix removes the outer `pre` tags whenever they contain the pattern
`<table class="rouge-table">`.
{% capture fix_linenos_code %}{% highlight AnyLanguage linenos %}
Apart from avoiding HTML validation errors, the fix allows the use of
the [Jekyll layout for compressing HTML](http://jch.penibelst.de),
which relies on `pre` tags not being nested, according to
https://github.com/penibelst/jekyll-compress-html/issues/71#issuecomment-172069842
USAGE
(Any names can be used for `some_var` and `some_language`.)
{% capture some_var %}
{% highlight some_language linenos %}
Some code
{% endhighlight %}{% endcapture %}{% include fix_linenos.html %}{{ fix_linenos_code }}
{% endhighlight %}
{% endcapture %}
{% include fix_linenos.html code=some_var %}
Caveats:
For code fences:
{% capture some_var %}
```some_language
Some code
```
{% endcapture %}
{% assign some_var = some_var | markdownify %}
{% include fix_linenos.html code=some_var %}
CAVEATS
The above does not work when `Some code` happens to contain the matched string
`<table class="rouge-table">`.
{%- endcomment %}
The use of this file overwrites the variable `fix_linenos_code` with `nil`.
{%- endcomment -%}
{% assign fix_linenos_code = include.code %}
{% if fix_linenos_code contains '<table class="rouge-table">' %}
{% assign fix_linenos_code = fix_linenos_code | replace: '<pre class="highlight">', '<pre>' %}
{% assign fix_linenos_code = fix_linenos_code | replace: "<pre><code", "<code" %}
{% assign fix_linenos_code = fix_linenos_code | replace: "</code></pre>", "</code>" %}
{% endif %}
{{ fix_linenos_code }}
{% assign fix_linenos_code = nil %}