2023-05-18 05:58:23 +03:00
|
|
|
<!-- Refactor the HTML structure -->
|
2020-08-14 19:35:00 +03:00
|
|
|
|
|
|
|
{% assign _content = include.content %}
|
|
|
|
|
2020-12-24 19:22:21 +03:00
|
|
|
<!--
|
|
|
|
In order to allow a wide table to scroll horizontally,
|
|
|
|
we suround the markdown table with `<div class="table-wrapper">` and `</div>`
|
|
|
|
-->
|
2021-07-04 15:09:45 +03:00
|
|
|
|
2022-03-03 13:05:48 +03:00
|
|
|
{% if _content contains '<table' %}
|
2020-12-14 10:01:05 +03:00
|
|
|
{% assign _content = _content
|
2022-03-03 13:05:48 +03:00
|
|
|
| replace: '<table', '<div class="table-wrapper"><table'
|
2020-12-14 10:01:05 +03:00
|
|
|
| replace: '</table>', '</table></div>'
|
2022-03-03 13:05:48 +03:00
|
|
|
| replace: '<code><div class="table-wrapper">', '<code>'
|
2020-12-14 10:01:05 +03:00
|
|
|
| replace: '</table></div></code>', '</table></code>'
|
|
|
|
%}
|
2020-08-14 19:35:00 +03:00
|
|
|
{% endif %}
|
|
|
|
|
|
|
|
<!--
|
|
|
|
Fixed kramdown code highlight rendering:
|
|
|
|
https://github.com/penibelst/jekyll-compress-html/issues/101
|
|
|
|
https://github.com/penibelst/jekyll-compress-html/issues/71#issuecomment-188144901
|
|
|
|
-->
|
2021-07-04 15:09:45 +03:00
|
|
|
|
2020-08-14 19:35:00 +03:00
|
|
|
{% if _content contains '<pre class="highlight">' %}
|
2020-12-14 10:01:05 +03:00
|
|
|
{% assign _content = _content
|
|
|
|
| replace: '<div class="highlight"><pre class="highlight"><code', '<div class="highlight"><code'
|
|
|
|
| replace: '</code></pre></div>', '</code></div>'
|
|
|
|
%}
|
|
|
|
{% endif %}
|
|
|
|
|
2022-10-24 15:56:15 +03:00
|
|
|
<!-- Change the icon of checkbox -->
|
2023-09-26 23:44:32 +03:00
|
|
|
|
2022-10-24 15:56:15 +03:00
|
|
|
{% if _content contains '<input type="checkbox"' %}
|
2020-12-14 10:01:05 +03:00
|
|
|
{% assign _content = _content
|
2023-09-24 20:47:59 +03:00
|
|
|
| replace: '<input type="checkbox" class="task-list-item-checkbox" disabled="disabled" checked="checked" />',
|
|
|
|
'<i class="fas fa-check-circle fa-fw checked"></i>'
|
|
|
|
| replace: '<input type="checkbox" class="task-list-item-checkbox" disabled="disabled" />',
|
|
|
|
'<i class="far fa-circle fa-fw"></i>'
|
2020-12-14 10:01:05 +03:00
|
|
|
%}
|
2020-08-14 19:35:00 +03:00
|
|
|
{% endif %}
|
|
|
|
|
2023-09-26 23:44:32 +03:00
|
|
|
<!-- Handle images -->
|
|
|
|
|
2023-05-18 05:58:23 +03:00
|
|
|
{% assign IMG_TAG = '<img ' %}
|
2021-07-04 15:09:45 +03:00
|
|
|
|
2023-05-18 05:58:23 +03:00
|
|
|
{% if _content contains IMG_TAG %}
|
2023-09-24 20:47:59 +03:00
|
|
|
{% assign _img_content = null %}
|
2021-12-14 18:28:15 +03:00
|
|
|
{% assign _img_snippets = _content | split: IMG_TAG %}
|
2021-06-30 14:08:42 +03:00
|
|
|
|
2022-12-11 02:09:40 +03:00
|
|
|
<!-- CDN URL -->
|
|
|
|
{% if site.img_cdn %}
|
|
|
|
{% if site.img_cdn contains '//' %}
|
|
|
|
{% assign _path_prefix = site.img_cdn %}
|
|
|
|
{% else %}
|
|
|
|
{% assign _path_prefix = site.img_cdn | relative_url %}
|
|
|
|
{% endif %}
|
|
|
|
{% else %}
|
|
|
|
{% assign _path_prefix = site.baseurl %}
|
|
|
|
{% endif %}
|
|
|
|
|
|
|
|
<!-- Add image path -->
|
|
|
|
{% if page.img_path %}
|
|
|
|
{% assign _path = page.img_path | append: '/' | replace: '//', '/' %}
|
|
|
|
{% assign _path_prefix = _path_prefix | append: _path %}
|
|
|
|
{% endif %}
|
|
|
|
|
2021-12-14 18:28:15 +03:00
|
|
|
{% for _img_snippet in _img_snippets %}
|
2021-06-30 14:08:42 +03:00
|
|
|
{% if forloop.first %}
|
2021-12-14 18:28:15 +03:00
|
|
|
{% assign _img_content = _img_snippet %}
|
2021-06-30 14:08:42 +03:00
|
|
|
{% continue %}
|
|
|
|
{% endif %}
|
|
|
|
|
2022-01-04 19:53:16 +03:00
|
|
|
{% assign _left = _img_snippet | split: '>' | first %}
|
|
|
|
{% assign _right = _img_snippet | remove: _left %}
|
2021-12-11 19:38:49 +03:00
|
|
|
|
2022-12-11 02:09:40 +03:00
|
|
|
{% unless _left contains 'src=' %}
|
|
|
|
{% continue %}
|
|
|
|
{% endunless %}
|
|
|
|
|
2022-12-13 16:41:32 +03:00
|
|
|
{% assign _left = _left | remove: ' /' | replace: ' w=', ' width=' | replace: ' h=', ' height=' %}
|
|
|
|
{% assign _attrs = _left | split: '" ' %}
|
2021-01-09 17:30:31 +03:00
|
|
|
|
2023-09-29 00:07:03 +03:00
|
|
|
{% assign _src = null %}
|
2023-09-24 20:47:59 +03:00
|
|
|
{% assign _lqip = null %}
|
|
|
|
{% assign _class = null %}
|
2022-12-11 02:09:40 +03:00
|
|
|
|
2021-06-30 14:08:42 +03:00
|
|
|
{% for _attr in _attrs %}
|
2022-12-13 16:41:32 +03:00
|
|
|
{% unless _attr contains '=' %}
|
2021-12-14 18:28:15 +03:00
|
|
|
{% continue %}
|
2022-12-13 16:41:32 +03:00
|
|
|
{% endunless %}
|
2021-12-14 18:28:15 +03:00
|
|
|
|
2023-05-12 20:02:15 +03:00
|
|
|
{% assign _pair = _attr | split: '="' %}
|
2021-12-14 18:28:15 +03:00
|
|
|
{% capture _key %}{{ _pair | first }}{% endcapture %}
|
2023-05-12 20:02:15 +03:00
|
|
|
{% capture _value %}{{ _pair | last | remove: '"' }}{% endcapture %}
|
2021-01-09 17:30:31 +03:00
|
|
|
|
2021-06-30 14:08:42 +03:00
|
|
|
{% case _key %}
|
2021-12-14 18:28:15 +03:00
|
|
|
{% when 'src' %}
|
|
|
|
{% assign _src = _value %}
|
2022-12-11 02:09:40 +03:00
|
|
|
{% when 'lqip' %}
|
|
|
|
{% assign _lqip = _value %}
|
2022-12-13 16:41:32 +03:00
|
|
|
{% when 'class' %}
|
|
|
|
{% assign _class = _value %}
|
2021-06-30 14:08:42 +03:00
|
|
|
{% endcase %}
|
|
|
|
{% endfor %}
|
|
|
|
|
2022-12-13 16:41:32 +03:00
|
|
|
<!-- take out classes -->
|
|
|
|
{% if _class %}
|
|
|
|
{% capture _old_class %}class="{{ _class }}"{% endcapture %}
|
|
|
|
{% assign _left = _left | remove: _old_class %}
|
|
|
|
{% endif %}
|
|
|
|
|
2023-09-24 20:47:59 +03:00
|
|
|
{% assign _final_src = null %}
|
2023-09-26 23:44:32 +03:00
|
|
|
{% assign _lazyload = true %}
|
2022-12-13 16:41:32 +03:00
|
|
|
|
2022-12-11 02:09:40 +03:00
|
|
|
{% unless _src contains '//' %}
|
|
|
|
{% assign _final_src = _path_prefix | append: _src %}
|
2023-09-26 23:44:32 +03:00
|
|
|
{% assign _src_alt = 'src="' | append: _path_prefix %}
|
|
|
|
{% assign _left = _left | replace: 'src="', _src_alt %}
|
2022-12-11 02:09:40 +03:00
|
|
|
{% endunless %}
|
|
|
|
|
|
|
|
{% if _lqip %}
|
2023-09-29 00:07:03 +03:00
|
|
|
{% if _lqip contains 'data:' %}
|
2023-09-26 23:44:32 +03:00
|
|
|
{% assign _lazyload = false %}
|
2023-09-29 00:07:03 +03:00
|
|
|
{% assign _class = _class | append: ' blur' %}
|
2023-09-26 23:44:32 +03:00
|
|
|
{% else %}
|
|
|
|
{% assign _lqip_alt = 'lqip="' | append: _path_prefix %}
|
|
|
|
{% assign _left = _left | replace: 'lqip="', _lqip_alt %}
|
|
|
|
{% endif %}
|
2021-12-14 18:28:15 +03:00
|
|
|
|
2023-09-26 23:44:32 +03:00
|
|
|
<!-- add image placeholder -->
|
|
|
|
{% assign _left = _left | replace: 'src=', 'data-src=' | replace: ' lqip=', ' data-lqip="true" src=' %}
|
2021-12-14 18:28:15 +03:00
|
|
|
|
2022-12-11 02:09:40 +03:00
|
|
|
{% else %}
|
2023-09-26 23:44:32 +03:00
|
|
|
{% assign _class = _class | append: ' shimmer' %}
|
2021-12-14 18:28:15 +03:00
|
|
|
{% endif %}
|
|
|
|
|
2023-09-26 23:44:32 +03:00
|
|
|
<!-- lazy-load images -->
|
|
|
|
{% if _lazyload %}
|
|
|
|
{% assign _left = _left | append: ' loading="lazy"' %}
|
|
|
|
{% endif %}
|
2021-12-14 18:28:15 +03:00
|
|
|
|
2023-05-18 05:58:23 +03:00
|
|
|
{% if page.layout == 'home' %}
|
|
|
|
<!-- create the image wrapper -->
|
2023-09-24 20:47:59 +03:00
|
|
|
{% assign _wrapper_start = '<div class="preview-img ' | append: _class | append: '">' %}
|
|
|
|
|
2023-05-18 05:58:23 +03:00
|
|
|
{% assign _img_content = _img_content | append: _wrapper_start %}
|
|
|
|
{% assign _right = _right | prepend: '></div' %}
|
|
|
|
|
|
|
|
{% else %}
|
2023-03-18 01:28:44 +03:00
|
|
|
<!-- make sure the `<img>` is wrapped by `<a>` -->
|
|
|
|
{% assign _parent = _right | slice: 1, 4 %}
|
|
|
|
|
|
|
|
{% if _parent == '</a>' %}
|
|
|
|
<!-- add class to exist <a> tag -->
|
|
|
|
{% assign _size = _img_content | size | minus: 1 %}
|
|
|
|
{% capture _class %}
|
|
|
|
class="img-link{% unless _lqip %} shimmer{% endunless %}"
|
|
|
|
{% endcapture %}
|
2023-09-24 20:47:59 +03:00
|
|
|
{% assign _img_content = _img_content | slice: 0, _size | append: _class | append: '>' %}
|
2023-09-26 23:44:32 +03:00
|
|
|
|
2023-03-18 01:28:44 +03:00
|
|
|
{% else %}
|
|
|
|
<!-- create the image wrapper -->
|
2023-09-24 20:47:59 +03:00
|
|
|
{% assign _wrapper_start = _final_src
|
|
|
|
| default: _src
|
|
|
|
| prepend: '<a href="'
|
|
|
|
| append: '" class="popup img-link '
|
|
|
|
| append: _class
|
|
|
|
| append: '">'
|
|
|
|
%}
|
|
|
|
|
2023-03-18 01:28:44 +03:00
|
|
|
{% assign _img_content = _img_content | append: _wrapper_start %}
|
2023-09-26 23:44:32 +03:00
|
|
|
{% assign _right = '></a' | append: _right %}
|
2023-03-18 01:28:44 +03:00
|
|
|
{% endif %}
|
2022-12-13 16:41:32 +03:00
|
|
|
{% endif %}
|
|
|
|
|
|
|
|
<!-- combine -->
|
2023-09-26 23:44:32 +03:00
|
|
|
{% assign _img_content = _img_content | append: IMG_TAG | append: _left | append: _right %}
|
2021-06-30 14:08:42 +03:00
|
|
|
{% endfor %}
|
|
|
|
|
2022-12-11 02:09:40 +03:00
|
|
|
{% if _img_content %}
|
|
|
|
{% assign _content = _img_content %}
|
|
|
|
{% endif %}
|
2021-01-09 17:30:31 +03:00
|
|
|
{% endif %}
|
|
|
|
|
2021-09-09 17:09:07 +03:00
|
|
|
<!-- Add header for code snippets -->
|
2021-07-04 15:09:45 +03:00
|
|
|
|
2021-09-15 17:50:28 +03:00
|
|
|
{% if _content contains '<div class="highlight"><code>' %}
|
|
|
|
{% assign _code_spippets = _content | split: '<div class="highlight"><code>' %}
|
|
|
|
{% assign _new_content = '' %}
|
|
|
|
|
|
|
|
{% for _snippet in _code_spippets %}
|
|
|
|
{% if forloop.last %}
|
|
|
|
{% assign _new_content = _new_content | append: _snippet %}
|
2021-07-04 15:09:45 +03:00
|
|
|
|
|
|
|
{% else %}
|
2023-09-24 20:47:59 +03:00
|
|
|
{% assign _left = _snippet | split: '><' | last %}
|
2021-09-15 17:50:28 +03:00
|
|
|
|
|
|
|
{% if _left contains 'file="' %}
|
2021-12-03 11:34:26 +03:00
|
|
|
{% assign _label_text = _left | split: 'file="' | last | split: '"' | first %}
|
2023-03-23 21:46:48 +03:00
|
|
|
{% assign _label_icon = 'far fa-file-code fa-fw' %}
|
2021-09-15 17:50:28 +03:00
|
|
|
{% else %}
|
2021-09-22 16:20:30 +03:00
|
|
|
{% assign _lang = _left | split: 'language-' | last | split: ' ' | first %}
|
2021-12-03 11:34:26 +03:00
|
|
|
{% capture _label_text %}{% include language-alias.html language=_lang %}{% endcapture %}
|
2023-03-23 21:46:48 +03:00
|
|
|
{% assign _label_icon = 'fas fa-code fa-fw small' %}
|
2021-09-15 17:50:28 +03:00
|
|
|
{% endif %}
|
|
|
|
|
2021-09-22 13:25:46 +03:00
|
|
|
{% capture _label %}
|
2022-01-12 19:23:08 +03:00
|
|
|
<span data-label-text="{{ _label_text | strip }}"><i class="{{ _label_icon }}"></i></span>
|
2021-09-22 13:25:46 +03:00
|
|
|
{% endcapture %}
|
|
|
|
|
2023-09-24 20:47:59 +03:00
|
|
|
{% assign _new_content = _new_content
|
|
|
|
| append: _snippet
|
|
|
|
| append: '<div class="code-header">'
|
|
|
|
| append: _label
|
|
|
|
| append: '<button aria-label="copy" data-title-succeed="'
|
|
|
|
| append: site.data.locales[include.lang].post.button.copy_code.succeed
|
|
|
|
| append: '"><i class="far fa-clipboard"></i></button></div>'
|
|
|
|
| append: '<div class="highlight"><code>'
|
2021-09-09 16:07:07 +03:00
|
|
|
%}
|
2021-07-04 15:09:45 +03:00
|
|
|
{% endif %}
|
|
|
|
{% endfor %}
|
|
|
|
|
2021-09-15 17:50:28 +03:00
|
|
|
{% assign _content = _new_content %}
|
2021-07-04 15:09:45 +03:00
|
|
|
{% endif %}
|
|
|
|
|
2021-12-05 21:19:23 +03:00
|
|
|
<!-- Create heading anchors -->
|
|
|
|
|
|
|
|
{% assign heading_levels = '2,3,4,5' | split: ',' %}
|
|
|
|
{% assign _heading_content = _content %}
|
|
|
|
|
|
|
|
{% for level in heading_levels %}
|
2023-09-24 20:47:59 +03:00
|
|
|
{% assign mark_start = '<h' | append: level | append: ' id="' %}
|
|
|
|
{% assign mark_end = '</h' | append: level | append: '>' %}
|
2021-12-05 21:19:23 +03:00
|
|
|
|
|
|
|
{% if _heading_content contains mark_start %}
|
2023-09-24 20:47:59 +03:00
|
|
|
{% assign _new_content = null %}
|
2021-12-05 21:19:23 +03:00
|
|
|
{% assign heading_snippets = _heading_content | split: mark_start %}
|
|
|
|
|
|
|
|
{% for snippet in heading_snippets %}
|
|
|
|
{% if forloop.first %}
|
|
|
|
{% assign _new_content = snippet %}
|
|
|
|
{% continue %}
|
|
|
|
{% endif %}
|
|
|
|
|
|
|
|
{% assign id = snippet | split: '"' | first %}
|
2023-09-24 20:47:59 +03:00
|
|
|
{% assign anchor = '<a href="#'
|
|
|
|
| append: id
|
|
|
|
| append: '" class="anchor text-muted"><i class="fas fa-hashtag"></i></a>'
|
|
|
|
%}
|
2021-12-05 21:19:23 +03:00
|
|
|
|
|
|
|
{% assign left = snippet | split: mark_end | first %}
|
2022-02-13 14:19:01 +03:00
|
|
|
{% assign right = snippet | slice: left.size, snippet.size %}
|
2023-04-10 05:54:27 +03:00
|
|
|
{% assign left = left | replace_first: '">', '"><span class="me-2">' | append: '</span>' %}
|
2021-12-05 21:19:23 +03:00
|
|
|
|
2023-09-24 20:47:59 +03:00
|
|
|
{% assign _new_content = _new_content | append: mark_start | append: left | append: anchor | append: right %}
|
2021-12-05 21:19:23 +03:00
|
|
|
{% endfor %}
|
|
|
|
|
|
|
|
{% assign _heading_content = _new_content %}
|
|
|
|
{% endif %}
|
|
|
|
{% endfor %}
|
|
|
|
|
|
|
|
{% assign _content = _heading_content %}
|
2021-06-30 14:08:42 +03:00
|
|
|
|
2020-12-14 10:01:05 +03:00
|
|
|
<!-- return -->
|
2020-08-14 19:35:00 +03:00
|
|
|
{{ _content }}
|