feat: support configure the code badge (#19)

This commit is contained in:
jeffreytse 2021-01-08 12:12:57 +08:00
parent c896442fcf
commit 3f2e5824e2

View file

@ -6,7 +6,7 @@
src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/10.1.1/languages/go.min.js"></script>
{%- assign name = 'code_badge.enabled' -%}
{%- include functions.html func='get_value' default='false' -%}
{%- include functions.html func='get_value' default='true' -%}
{%- assign badge_enabled = return -%}
{%- assign name = 'code_badge.color' -%}
@ -21,6 +21,11 @@
{%- include functions.html func='get_value' default='uppercase' -%}
{%- assign badge_text_transform = return -%}
{{ badge_enabled }}
{{ badge_color }}
{{ badge_background_color }}
{{ badge_text_transform }}
<script>
// Init highlight js
document.addEventListener('DOMContentLoaded', function(event) {
@ -47,8 +52,17 @@ document.addEventListener('DOMContentLoaded', function(event) {
block.parentNode.setAttribute('data-lang', lang);
}
function addBadge(block) {
var enabled = ('{{ badge_enabled }}' || 'true').toLowerCase();
if (enabled == 'true') {
var pre = block.parentElement;
pre.classList.add('badge');
}
}
function handle(block) {
addLangData(block);
addBadge(block)
hljs.highlightBlock(block);
}
@ -61,13 +75,13 @@ document.addEventListener('DOMContentLoaded', function(event) {
<style>
/* code language badge */
pre::before {
pre.badge::before {
content: attr(data-lang);
color: #fff;
background-color: #ff4e00;
color: {{badge_color}};
background-color: {{badge_background_color}};
padding: 0 .5em;
border-radius: 0 2px;
text-transform: uppercase;
text-transform: {{badge_text_transform}};
text-align: center;
min-width: 32px;
display: inline-block;