summaryrefslogtreecommitdiff
path: root/_includes
diff options
context:
space:
mode:
authorjeffreytse <jeffreytse.mail@gmail.com>2021-01-08 12:12:57 +0800
committerjeffreytse <jeffreytse.mail@gmail.com>2021-01-08 12:12:57 +0800
commit3f2e5824e2422ac419e03e7f7f96c38a80eba028 (patch)
tree6c75d45c27a4ca326ffbe6e4a1fa5ef1aa0c3b88 /_includes
parentc896442fcf46fe12fc1c8b811ddc71f8127e8509 (diff)
feat: support configure the code badge (#19)
Diffstat (limited to '_includes')
-rw-r--r--_includes/extensions/code-highlight.html24
1 files changed, 19 insertions, 5 deletions
diff --git a/_includes/extensions/code-highlight.html b/_includes/extensions/code-highlight.html
index c843459..3903c21 100644
--- a/_includes/extensions/code-highlight.html
+++ b/_includes/extensions/code-highlight.html
@@ -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;