Files
hexo-theme-butterfly/scripts/tag/hide.js
T
Jerry c1ac4a5e16 breaking changes: 升級 fontawesome 到 v6 #689
feat: snackbar 增加圓角
feat: 增加 flink 標籤外掛
fix: 修復點擊 toc 外圍,控制檯報錯的 bug
fix: Facebook Comments 無法使用 #787
fix: chat_btn 聊天按鈕翻譯缺失 #791
fix: local search 的 content 設爲 false, 搜索無法運行的 bug #764
fix: Mermaid 圖表渲染後元素高度過大 #773
fix: 文章頁分享按鈕另開一行時, 導航頁寬度沒有 100% 的 bug #765
improvement: 語義化 toggle 標籤外掛
improvement: darkmode 下 toc 背景顏色更改
2022-02-13 15:23:13 +08:00

71 lines
2.0 KiB
JavaScript

/**
* Butterfly
* @example
* hideInline
* {% hideInline content,display,bg,color %}
* content不能包含當引號,可用 '
* hideBlock
* {% hideBlock display,bg,color %}
* content
* {% endhideBlock %}
* hideToggle
* {% hideToggle display,bg,color %}
* content
* {% endhideToggle %}
*/
'use strict'
function hideInline (args) {
args = args.join(' ').split(',')
const content = args[0]
const display = args[1] || 'Click'
const bg = args[2] || false
const color = args[3] || false
let group = 'style="'
if (bg) group += `background-color: ${bg};`
if (color) group += `color: ${color}`
group += '"'
return `<span class="hide-inline"><button type="button" class="hide-button" ${group}>${display}
</button><span class="hide-content">${content}</span></span>`
}
function hideBlock (args, content) {
args = args.join(' ').split(',')
const display = args[0] || 'Click'
const bg = args[1] || false
const color = args[2] || false
let group = 'style="'
if (bg) group += `background-color: ${bg};`
if (color) group += `color: ${color}`
group += '"'
return `<div class="hide-block"><button type="button" class="hide-button" ${group}>${display}
</button><div class="hide-content">${hexo.render.renderSync({ text: content, engine: 'markdown' })}</div></div>`
}
function hideToggle (args, content) {
args = args.join(' ').split(',')
const display = args[0]
const bg = args[1] || false
const color = args[2] || false
let group = 'style="'
let border = ''
if (bg) {
border = `style="border: 1px solid ${bg}"`
group += `background-color: ${bg};`
}
if (color) group += `color: ${color}`
group += '"'
return `<details class="toggle" ${border}><summary class="toggle-button" ${group}>${display}</summary><div class="toggle-content">${hexo.render.renderSync({ text: content, engine: 'markdown' })}</div></details>`
}
hexo.extend.tag.register('hideInline', hideInline)
hexo.extend.tag.register('hideBlock', hideBlock, { ends: true })
hexo.extend.tag.register('hideToggle', hideToggle, { ends: true })