Create the code language badge by Liquid
It prevents the language badges from flashing
This commit is contained in:
parent
65dbea9d3b
commit
5f1e6e9350
6 changed files with 33 additions and 26 deletions
|
@ -8,6 +8,7 @@
|
|||
In order to allow a wide table to scroll horizontally,
|
||||
we suround the markdown table with `<div class="table-wrapper">` and `</div>`
|
||||
-->
|
||||
|
||||
{% if _content contains '<table>' %}
|
||||
{% assign _content = _content
|
||||
| replace: '<table>', '<div class="table-wrapper"><table>'
|
||||
|
@ -21,6 +22,7 @@
|
|||
https://github.com/penibelst/jekyll-compress-html/issues/101
|
||||
https://github.com/penibelst/jekyll-compress-html/issues/71#issuecomment-188144901
|
||||
-->
|
||||
|
||||
{% if _content contains '<pre class="highlight">' %}
|
||||
{% assign _content = _content
|
||||
| replace: '<div class="highlight"><pre class="highlight"><code', '<div class="highlight"><code'
|
||||
|
@ -29,6 +31,7 @@
|
|||
{% endif %}
|
||||
|
||||
<!-- Add attribute 'hide-bullet' to the checkbox list -->
|
||||
|
||||
{% if _content contains '<li class="task-list-item"><' %}
|
||||
{% assign _content = _content
|
||||
| replace: '"task-list-item"><', '"task-list-item" hide-bullet><'
|
||||
|
@ -36,9 +39,12 @@
|
|||
{% endif %}
|
||||
|
||||
|
||||
<!-- images -->
|
||||
|
||||
{% if _content contains '<img src="' %}
|
||||
|
||||
<!-- add CDN prefix if it exists -->
|
||||
|
||||
{% if site.img_cdn != '' %}
|
||||
{% assign img_path_replacement = '<img src="' | append: site.img_cdn | append: '/' %}
|
||||
{% else %}
|
||||
|
@ -48,6 +54,7 @@
|
|||
{% assign _content = _content | replace: '<img src="/', img_path_replacement %}
|
||||
|
||||
<!-- lazy-load images <https://github.com/ApoorvSaxena/lozad.js#usage> -->
|
||||
|
||||
{% assign _content = _content | replace: '<img src="', '<img data-proofer-ignore data-src="' %}
|
||||
|
||||
<!-- add image placehoder to prevent layout reflow -->
|
||||
|
@ -95,6 +102,29 @@
|
|||
|
||||
{% endif %}
|
||||
|
||||
<!-- Add lang-badge for code snippets -->
|
||||
|
||||
{% if _content contains '<div class="language-' %}
|
||||
{% assign _code_splits = _content | split: '<div class="language-' %}
|
||||
{% assign _new_content = nil %}
|
||||
|
||||
{% for _snippet in _code_splits %}
|
||||
{% if forloop.first %}
|
||||
{% assign _new_content = _snippet %}
|
||||
{% else %}
|
||||
{% assign _lang = _snippet | split: ' ' | first %}
|
||||
{% capture _tag_head %}<div lang="{{_lang}}" class="language-{% endcapture %}
|
||||
{% assign _new_content = _new_content | append: _tag_head | append: _snippet %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
|
||||
{% if _new_content %}
|
||||
{% assign _content = _new_content %}
|
||||
{% endif %}
|
||||
|
||||
{% endif %}
|
||||
|
||||
|
||||
<!-- return -->
|
||||
|
||||
{{ _content }}
|
||||
|
|
|
@ -25,7 +25,7 @@ $(function() {
|
|||
const title = nextTag.prop('tagName') === 'EM' ? nextTag.text() : '';
|
||||
const src = $(this).attr('data-src'); // created by lozad.js
|
||||
|
||||
$(this).wrap(`<a href="${src}" title="${title}" class="popup"></a>`);
|
||||
$(this).wrap(`<a href="${src}" title="${title}" class="popup img-link"></a>`);
|
||||
}
|
||||
);
|
||||
|
||||
|
@ -42,6 +42,4 @@ $(function() {
|
|||
|
||||
/* markup the image links */
|
||||
|
||||
$(`${IMG_SCOPE} a`).has("img").addClass('img-link');
|
||||
|
||||
});
|
||||
|
|
|
@ -1,20 +0,0 @@
|
|||
/**
|
||||
* Add language indicator to code snippets
|
||||
*/
|
||||
|
||||
$(function() {
|
||||
const prefix = "language-";
|
||||
const regex = new RegExp(`^${prefix}([a-z])+$`);
|
||||
|
||||
$(`div[class^=${prefix}`).each(function() {
|
||||
let classes = $(this).attr("class").split(" ");
|
||||
|
||||
classes.forEach((_class) => {
|
||||
if (regex.test(_class)) {
|
||||
let lang = _class.substring(prefix.length);
|
||||
$(this).attr("lang", `${lang}`);
|
||||
}
|
||||
});
|
||||
|
||||
});
|
||||
});
|
2
assets/js/dist/page.min.js
vendored
2
assets/js/dist/page.min.js
vendored
|
@ -3,4 +3,4 @@
|
|||
* © 2019 Cotes Chung
|
||||
* MIT Licensed
|
||||
*/
|
||||
function copyLink(e){e&&0!==e.length||(e=window.location.href);const o=$("<input>");$("body").append(o),o.val(e).select(),document.execCommand("copy"),o.remove(),alert("Link copied successfully!")}$(function(){$(window).scroll(()=>{$(this).scrollTop()>50&&"none"===$("#sidebar-trigger").css("display")?$("#back-to-top").fadeIn():$("#back-to-top").fadeOut()}),$("#back-to-top").click(()=>($("body,html").animate({scrollTop:0},800),!1))}),$(function(){const e=$("#sidebar-trigger"),o=$("#search-trigger"),t=$("#search-cancel"),s=$("#search-cleaner"),a=$("#main"),l=$("#topbar-title"),n=$("#search-wrapper"),i=$("#search-result-wrapper"),c=$("#search-results"),d=$("#search-input"),r=$("#search-hints"),u=function(){let e=0;return{block(){e=window.scrollY,$("html,body").scrollTop(0)},release(){$("html,body").scrollTop(e)},getOffset:()=>e}}(),p={on(){e.addClass("unloaded"),l.addClass("unloaded"),o.addClass("unloaded"),n.addClass("d-flex"),t.addClass("loaded")},off(){t.removeClass("loaded"),n.removeClass("d-flex"),e.removeClass("unloaded"),l.removeClass("unloaded"),o.removeClass("unloaded")}},f=function(){let e=!1;return{on(){e||(u.block(),i.removeClass("unloaded"),a.addClass("unloaded"),e=!0)},off(){e&&(c.empty(),r.hasClass("unloaded")&&r.removeClass("unloaded"),i.addClass("unloaded"),s.removeClass("visible"),a.removeClass("unloaded"),u.release(),d.val(""),e=!1)},isVisible:()=>e}}();function h(){return t.hasClass("loaded")}o.click(function(){p.on(),f.on(),d.focus()}),t.click(function(){p.off(),f.off()}),d.focus(function(){n.addClass("input-focus")}),d.focusout(function(){n.removeClass("input-focus")}),d.on("keyup",function(e){8===e.keyCode&&""===d.val()?h()?r.removeClass("unloaded"):f.off():""!==d.val()&&(f.on(),s.hasClass("visible")||s.addClass("visible"),h()&&r.addClass("unloaded"))}),s.on("click",function(){d.val(""),h()?(r.removeClass("unloaded"),c.empty()):f.off(),d.focus(),s.removeClass("visible")})}),$(function(){const e=function(){let e=!1;const o=$("body");return{toggle(){!1===e?o.attr("sidebar-display",""):o.removeAttr("sidebar-display"),e=!e}}}();$("#sidebar-trigger").click(e.toggle),$("#mask").click(e.toggle)}),$(function(){$('[data-toggle="tooltip"]').tooltip()}),$(function(){const e=$("#topbar-wrapper"),o=$("#toc-wrapper"),t=$(".access"),s=$("#search-input");let a,l=0;const n=5,i=e.outerHeight();$(window).scroll(function(e){$("#topbar-title").is(":hidden")&&(a=!0)}),setInterval(function(){a&&(!function(){var a=$(this).scrollTop();Math.abs(l-a)<=n||(a>l&&a>i?(e.removeClass("topbar-down").addClass("topbar-up"),o.length>0&&o.removeClass("topbar-down"),t.length>0&&t.removeClass("topbar-down"),s.is(":focus")&&s.blur()):a+$(window).height()<$(document).height()&&(e.removeClass("topbar-up").addClass("topbar-down"),o.length>0&&o.addClass("topbar-down"),t.length>0&&t.addClass("topbar-down")),l=a)}(),a=!1)},250)}),$(function(){const e=$("#topbar-title"),o=$("div.post>h1"),t=e.text().trim();let s=o.length>0?o.text().trim():$("h1").text().trim();($("#page-category").length||$("#page-tag").length)&&/\s/.test(s)&&(s=s.replace(/[0-9]/g,"").trim()),$(window).scroll(function(){if($("#post-list").length||o.is(":hidden")||e.is(":hidden")||$("#sidebar.sidebar-expand").length)return!1;$(this).scrollTop()>=95?e.text()!==s&&e.text(s):e.text()!==t&&e.text(t)}),e.click(function(){$("body,html").animate({scrollTop:0},800)})}),$(function(){$("input[type=checkbox]").addClass("unloaded"),$("input[type=checkbox][checked]").before('<i class="fas fa-check-circle checked"></i>'),$("input[type=checkbox]:not([checked])").before('<i class="far fa-circle"></i>')}),$(function(){const e="#main > div.row:first-child > div:first-child";if($(`${e} img`).length<=0)return;const o=document.querySelectorAll(`${e} img[data-src]`);lozad(o).observe(),$(`${e} p > img[data-src],${e} img[data-src].preview-img`).each(function(){let e=$(this).next();const o="EM"===e.prop("tagName")?e.text():"",t=$(this).attr("data-src");$(this).wrap(`<a href="${t}" title="${o}" class="popup"></a>`)}),$(".popup").magnificPopup({type:"image",closeOnContentClick:!0,showCloseBtn:!1,zoom:{enabled:!0,duration:300,easing:"ease-in-out"}}),$(`${e} a`).has("img").addClass("img-link")});
|
||||
function copyLink(e){e&&0!==e.length||(e=window.location.href);const o=$("<input>");$("body").append(o),o.val(e).select(),document.execCommand("copy"),o.remove(),alert("Link copied successfully!")}$(function(){$(window).scroll(()=>{$(this).scrollTop()>50&&"none"===$("#sidebar-trigger").css("display")?$("#back-to-top").fadeIn():$("#back-to-top").fadeOut()}),$("#back-to-top").click(()=>($("body,html").animate({scrollTop:0},800),!1))}),$(function(){const e=$("#sidebar-trigger"),o=$("#search-trigger"),t=$("#search-cancel"),s=$("#search-cleaner"),a=$("#main"),l=$("#topbar-title"),n=$("#search-wrapper"),i=$("#search-result-wrapper"),c=$("#search-results"),d=$("#search-input"),r=$("#search-hints"),u=function(){let e=0;return{block(){e=window.scrollY,$("html,body").scrollTop(0)},release(){$("html,body").scrollTop(e)},getOffset:()=>e}}(),p={on(){e.addClass("unloaded"),l.addClass("unloaded"),o.addClass("unloaded"),n.addClass("d-flex"),t.addClass("loaded")},off(){t.removeClass("loaded"),n.removeClass("d-flex"),e.removeClass("unloaded"),l.removeClass("unloaded"),o.removeClass("unloaded")}},f=function(){let e=!1;return{on(){e||(u.block(),i.removeClass("unloaded"),a.addClass("unloaded"),e=!0)},off(){e&&(c.empty(),r.hasClass("unloaded")&&r.removeClass("unloaded"),i.addClass("unloaded"),s.removeClass("visible"),a.removeClass("unloaded"),u.release(),d.val(""),e=!1)},isVisible:()=>e}}();function h(){return t.hasClass("loaded")}o.click(function(){p.on(),f.on(),d.focus()}),t.click(function(){p.off(),f.off()}),d.focus(function(){n.addClass("input-focus")}),d.focusout(function(){n.removeClass("input-focus")}),d.on("keyup",function(e){8===e.keyCode&&""===d.val()?h()?r.removeClass("unloaded"):f.off():""!==d.val()&&(f.on(),s.hasClass("visible")||s.addClass("visible"),h()&&r.addClass("unloaded"))}),s.on("click",function(){d.val(""),h()?(r.removeClass("unloaded"),c.empty()):f.off(),d.focus(),s.removeClass("visible")})}),$(function(){const e=function(){let e=!1;const o=$("body");return{toggle(){!1===e?o.attr("sidebar-display",""):o.removeAttr("sidebar-display"),e=!e}}}();$("#sidebar-trigger").click(e.toggle),$("#mask").click(e.toggle)}),$(function(){$('[data-toggle="tooltip"]').tooltip()}),$(function(){const e=$("#topbar-wrapper"),o=$("#toc-wrapper"),t=$(".access"),s=$("#search-input");let a,l=0;const n=5,i=e.outerHeight();$(window).scroll(function(e){$("#topbar-title").is(":hidden")&&(a=!0)}),setInterval(function(){a&&(!function(){var a=$(this).scrollTop();Math.abs(l-a)<=n||(a>l&&a>i?(e.removeClass("topbar-down").addClass("topbar-up"),o.length>0&&o.removeClass("topbar-down"),t.length>0&&t.removeClass("topbar-down"),s.is(":focus")&&s.blur()):a+$(window).height()<$(document).height()&&(e.removeClass("topbar-up").addClass("topbar-down"),o.length>0&&o.addClass("topbar-down"),t.length>0&&t.addClass("topbar-down")),l=a)}(),a=!1)},250)}),$(function(){const e=$("#topbar-title"),o=$("div.post>h1"),t=e.text().trim();let s=o.length>0?o.text().trim():$("h1").text().trim();($("#page-category").length||$("#page-tag").length)&&/\s/.test(s)&&(s=s.replace(/[0-9]/g,"").trim()),$(window).scroll(function(){if($("#post-list").length||o.is(":hidden")||e.is(":hidden")||$("#sidebar.sidebar-expand").length)return!1;$(this).scrollTop()>=95?e.text()!==s&&e.text(s):e.text()!==t&&e.text(t)}),e.click(function(){$("body,html").animate({scrollTop:0},800)})}),$(function(){$("input[type=checkbox]").addClass("unloaded"),$("input[type=checkbox][checked]").before('<i class="fas fa-check-circle checked"></i>'),$("input[type=checkbox]:not([checked])").before('<i class="far fa-circle"></i>')}),$(function(){const e="#main > div.row:first-child > div:first-child";if($(`${e} img`).length<=0)return;const o=document.querySelectorAll(`${e} img[data-src]`);lozad(o).observe(),$(`${e} p > img[data-src],${e} img[data-src].preview-img`).each(function(){let e=$(this).next();const o="EM"===e.prop("tagName")?e.text():"",t=$(this).attr("data-src");$(this).wrap(`<a href="${t}" title="${o}" class="popup img-link"></a>`)}),$(".popup").magnificPopup({type:"image",closeOnContentClick:!0,showCloseBtn:!1,zoom:{enabled:!0,duration:300,easing:"ease-in-out"}})});
|
2
assets/js/dist/post.min.js
vendored
2
assets/js/dist/post.min.js
vendored
File diff suppressed because one or more lines are too long
|
@ -45,7 +45,6 @@ const postJs = () => {
|
|||
`${JS_SRC}/commons/*.js`,
|
||||
`${JS_SRC}/utils/img-extra.js`,
|
||||
`${JS_SRC}/utils/timeago.js`,
|
||||
`${JS_SRC}/utils/lang-badge.js`,
|
||||
`${JS_SRC}/utils/checkbox.js`,
|
||||
`${JS_SRC}/utils/copy-link.js`,
|
||||
// 'smooth-scroll.js' must be called after ToC is ready
|
||||
|
|
Loading…
Reference in a new issue