This commit is contained in:
myw
2024-10-20 17:47:28 +08:00
parent 95ca6878f0
commit c72f8c41ec
32 changed files with 207 additions and 209 deletions

View File

@@ -86,7 +86,7 @@ npm i hexo-theme-butterfly
- [x] Share (Sharejs/Addtoany)
- [X] Comment (Disqus/Disqusjs/Livere/Gitalk/Valine/Waline/Utterances/Facebook Comments/Twikoo/Giscus/Remark42/artalk)
- [x] Multiple Comment System Support
- [x] Online Chats (Chatra/Tidio/Daovoice/Crisp)
- [x] Online Chats (Chatra/Tidio/Crisp)
- [x] Web analytics
- [x] Google AdSense
- [x] Webmaster Verification

View File

@@ -86,7 +86,7 @@ theme: butterfly
- [x] 多種分享系統Sharejs/Addtoany
- [X] 多種評論系統Disqus/Disqusjs/Livere/Gitalk/Valine/Waline/Utterances/Facebook Comments/Twikoo/Giscus/Remark42/artalk
- [x] 支持雙評論部署
- [x] 多種在線聊天Chatra/Tidio/Daovoice/Crisp
- [x] 多種在線聊天Chatra/Tidio/Crisp
- [x] 多種分析系統
- [x] 谷歌廣告/手動廣告位置
- [x] 各種站長驗證

View File

@@ -645,7 +645,7 @@ artalk:
# --------------------------------------
chat:
# Choose: chatra/tidio/daovoice/crisp
# Choose: chatra/tidio/crisp
# Leave it empty if you don't need chat
use:
# Chat Button [recommend]
@@ -662,10 +662,6 @@ chatra:
tidio:
public_key:
# http://dashboard.daovoice.io/app
daovoice:
app_id:
# https://crisp.chat/en/
crisp:
website_id:

View File

@@ -105,15 +105,9 @@ mixin indexPostUI()
i.fa-solid.fa-spinner.fa-spin
//- Display the article introduction on homepage
case theme.index_post_content.method
when false
- break
when 1
.content!= article.description
when 2
.content!= article.description || truncate(article.content, theme.index_post_content.length)
default
.content!= truncate(article.content, theme.index_post_content.length)
- const content = postDesc(article)
if content
.content!=content
if theme.ad && theme.ad.index
if (index + 1) % 3 === 0

View File

@@ -21,6 +21,8 @@
let start = 0
const container = document.getElementById('article-container')
const showDateAndTine = date => new Date(date).toLocaleString()
const addData = data => {
const cLength = data.length
const end = start + 10 > cLength ? cLength : start + 10
@@ -34,7 +36,7 @@
</div>
<div class="shuoshuo-info">
<div class="shuoshuo-author">${item.author || '!{config.author}'}</div>
<div class="shuoshuo-date">${btf.diffDate(item.date, true)}</div>
<time class="shuoshuo-date" title="${showDateAndTine(item.date)}">${btf.diffDate(item.date, true)}</time>
</div>
</div>
<div class="shuoshuo-content">
@@ -97,7 +99,7 @@
img.no-lightbox(src=i.avatar || url_for(theme.avatar.img))
.shuoshuo-info
.shuoshuo-author=i.author || config.author
.shuoshuo-date=relative_date(i.date)
time.shuoshuo-date(title=full_date(i.date))=date(i.date)
.shuoshuo-content
!=markdown(i.content)
.shuoshuo-footer

View File

@@ -1,2 +1,2 @@
.tag-cloud-list.is-center
.tag-cloud-list.text-center
!=cloudTags({source: site.tags, orderby: page.orderby || 'random', order: page.order || 1, minfontsize: 1.2, maxfontsize: 1.5, limit: 0, unit: 'em'})

View File

@@ -7,30 +7,28 @@
}
if is_post()
- let prev = theme.post_pagination === 1 ? page.prev : page.next
- let next = theme.post_pagination === 1 ? page.next : page.prev
- let paginationOrder = theme.post_pagination === 1 ? { prev: page.prev, next: page.next } : { prev: page.next, next: page.prev }
nav#pagination.pagination-post
if(prev)
- var hasPageNext = next ? 'pull-left' : 'pull-full'
a.prev-post(class=hasPageNext href=url_for(prev.path) title=prev.title)
if prev.cover_type === 'img'
img.cover(src=url_for(prev.cover) onerror=`onerror=null;src='${url_for(theme.error_img.post_page)}'` alt='cover of previous post')
else
.cover(style=`background: ${prev.cover || 'var(--default-bg-color)'}`)
.pagination-info
.label=_p('pagination.prev')
.prev_info=prev.title
each direction, key in paginationOrder
if direction
- const getPostDesc = direction.postDesc || postDesc(direction)
- let className = key === 'prev' ? (paginationOrder.next ? '' : 'full-width') : (paginationOrder.prev ? '' : 'full-width')
- className = getPostDesc ? className : className + ' no-desc'
a.pagination-related(class=className href=url_for(direction.path) title=direction.title)
if direction.cover_type === 'img'
img.cover(src=url_for(direction.cover) onerror=`onerror=null;src='${url_for(theme.error_img.post_page)}'` alt=`cover of ${key === 'prev' ? 'previous' : 'next'} post`)
else
.cover(style=`background: ${direction.cover || 'var(--default-bg-color)'}`)
if(next)
- var hasPagePrev = prev ? 'pull-right' : 'pull-full'
a.next-post(class=hasPagePrev href=url_for(next.path) title=next.title)
if next.cover_type === 'img'
img.cover(src=url_for(next.cover) onerror=`onerror=null;src='${url_for(theme.error_img.post_page)}'` alt='cover of next post')
else
.cover(style=`background: ${next.cover || 'var(--default-bg-color)'}`)
.pagination-info
.label=_p('pagination.next')
.next_info=next.title
.info(class=key === 'prev' ? '' : 'text-right')
.info-1
.info-item-1=_p(`pagination.${key}`)
.info-item-2!=direction.title
if getPostDesc
.info-2
.info-item-1!=getPostDesc
else
nav#pagination
.pagination

View File

@@ -2,9 +2,9 @@ if theme.menu
#sidebar
#menu-mask
#sidebar-menus
.avatar-img.is-center
.avatar-img.text-center
img(src=url_for(theme.avatar.img) onerror=`onerror=null;src='${theme.error_img.flink}'` alt="avatar")
.site-data.is-center
.site-data.text-center
a(href=url_for(config.archive_dir) + '/')
.headline= _p('aside.articles')
.length-num= site.posts.length

View File

@@ -1,12 +1,12 @@
script.
(() => {
const abcjsInit = () => {
const abcjsFn = () => {
const abcjsFn = () => setTimeout(() => {
document.querySelectorAll(".abc-music-sheet").forEach(ele => {
if (ele.children.length > 0) return
ABCJS.renderAbc(ele, ele.innerHTML, {responsive: 'resize'})
})
}
}, 100)
typeof ABCJS === 'object' ? abcjsFn()
: btf.getScript('!{url_for(theme.asset.abcjs_basic_js)}').then(abcjsFn)

View File

@@ -1,40 +0,0 @@
//- https://guide.daocloud.io/daovoice/javascript-api-5869833.html
script.
(() => {
(function(i,s,o,g,r,a,m){i["DaoVoiceObject"]=r;i[r]=i[r]||function(){(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;a.charset="utf-8";m.parentNode.insertBefore(a,m)})(window,document,"script",('https:' == document.location.protocol ? 'https:' : 'http:') + "//widget.daovoice.io/widget/!{theme.daovoice.app_id}.js","daovoice")
const isChatBtn = !{theme.chat.rightside_button}
const isChatHideShow = !{theme.chat.button_hide_show}
daovoice('init', {
app_id: '!{theme.daovoice.app_id}',},{
launcher: {
disableLauncherIcon: isChatBtn
},
});
daovoice('update');
if (isChatBtn) {
window.chatBtnFn = () => {
const isShow = document.getElementById('daodream-messenger').classList.contains('daodream-messenger-active')
isShow ? daovoice('hide') : daovoice('show')
}
} else if (isChatHideShow) {
window.chatBtn = {
hide: () => {
daovoice('update', {},{
launcher: {
disableLauncherIcon: true
}
})
},
show: () => {
daovoice('update', {}, {
launcher: {
disableLauncherIcon: false
}
})
}
}
}
})()

View File

@@ -3,7 +3,5 @@ case theme.chat.use
include ./chatra.pug
when 'tidio'
include ./tidio.pug
when 'daovoice'
include ./daovoice.pug
when 'crisp'
include ./crisp.pug

View File

@@ -6,7 +6,7 @@
button.search-close-button
i.fas.fa-times
#loading-database.is-center
#loading-database.text-center
i.fas.fa-spinner.fa-pulse
span= ' ' + _p("search.load_data")

View File

@@ -1,5 +1,5 @@
if theme.aside.card_author.enable
.card-widget.card-info.is-center
.card-widget.card-info.text-center
.avatar-img
img(src=url_for(theme.avatar.img) onerror=`this.onerror=null;this.src='` + url_for(theme.error_img.flink) + `'` alt="avatar")
.author-info-name= config.author

View File

@@ -1,6 +1,6 @@
{
"name": "hexo-theme-butterfly",
"version": "5.1.0-b1",
"version": "5.1.0",
"description": "A Simple and Card UI Design theme for Hexo",
"main": "package.json",
"scripts": {

View File

@@ -9,7 +9,7 @@ activate_power_mode:
algolia_search:
name: algoliasearch
file: dist/lite/builds/browser.umd.js
version: 5.8.1
version: 5.9.1
aplayer_css:
name: aplayer
file: dist/APlayer.min.css
@@ -45,7 +45,7 @@ canvas_ribbon:
chartjs:
name: chart.js
file: dist/chart.umd.min.js
version: 4.4.4
version: 4.4.5
clickShowText:
name: butterfly-extsrc
file: dist/click-show-text.min.js
@@ -111,7 +111,7 @@ instantpage:
instantsearch:
name: instantsearch.js
file: dist/instantsearch.production.min.js
version: 4.75.0
version: 4.75.1
katex:
name: katex
file: dist/katex.min.css

View File

@@ -0,0 +1,36 @@
'use strict'
const { stripHTML, truncate } = require('hexo-util')
// Truncates the given content to a specified length, removing HTML tags and replacing newlines with spaces.
const truncateContent = (content, length) => {
return truncate(stripHTML(content), { length, separator: ' ' }).replace(/\n/g, ' ')
}
// Generates a post description based on the provided data and theme configuration.
const postDesc = (data, hexo) => {
const { description, content, postDesc } = data
if (postDesc) return postDesc
const { length, method } = hexo.theme.config.index_post_content
if (method === false) return
let result
switch (method) {
case 1:
result = description
break
case 2:
result = description || truncateContent(content, length)
break
default:
result = truncateContent(content, length)
}
data.postDesc = result
return result
}
module.exports = { truncateContent, postDesc }

View File

@@ -380,9 +380,6 @@ hexo.extend.filter.register('before_generate', () => {
tidio: {
public_key: null
},
daovoice: {
app_id: null
},
crisp: {
website_id: null
},

View File

@@ -1,10 +1,13 @@
'use strict'
const { stripHTML, prettyUrls, truncate } = require('hexo-util')
const { truncateContent, postDesc } = require('../common/postDesc')
const { prettyUrls } = require('hexo-util')
const crypto = require('crypto')
hexo.extend.helper.register('truncate', (content, length) => {
return truncate(stripHTML(content), { length, separator: ' ' }).replace(/\n/g, ' ')
hexo.extend.helper.register('truncate', truncateContent)
hexo.extend.helper.register('postDesc', data => {
return postDesc(data, hexo)
})
hexo.extend.helper.register('cloudTags', function (options = {}) {

View File

@@ -1,3 +1,4 @@
/* eslint-disable camelcase */
/**
* Butterfly
* Related Posts
@@ -6,12 +7,15 @@
'use strict'
const { postDesc } = require('../common/postDesc')
hexo.extend.helper.register('related_posts', function (currentPost, allPosts) {
let relatedPosts = []
const tagsData = currentPost.tags
tagsData.length && tagsData.forEach(function (tag) {
allPosts.forEach(function (post) {
if (currentPost.path !== post.path && isTagRelated(tag.name, post.tags)) {
const getPostDesc = post.postDesc || postDesc(post, hexo)
const relatedPost = {
title: post.title,
path: post.path,
@@ -19,7 +23,8 @@ hexo.extend.helper.register('related_posts', function (currentPost, allPosts) {
cover_type: post.cover_type,
weight: 1,
updated: post.updated,
created: post.date
created: post.date,
postDesc: getPostDesc
}
const index = findItem(relatedPosts, 'path', post.path)
if (index !== -1) {
@@ -50,20 +55,27 @@ hexo.extend.helper.register('related_posts', function (currentPost, allPosts) {
result += '<div class="relatedPosts-list">'
for (let i = 0; i < Math.min(relatedPosts.length, limitNum); i++) {
const cover = relatedPosts[i].cover || 'var(--default-bg-color)'
const title = this.escape_html(relatedPosts[i].title)
result += `<a href="${this.url_for(relatedPosts[i].path)}" title="${title}">`
if (relatedPosts[i].cover_type === 'img') {
result += `<img class="cover" src="${this.url_for(cover)}" alt="cover">`
let { cover, title, path, cover_type, created, updated, postDesc } = relatedPosts[i]
const { escape_html, url_for, date } = this
cover = cover || 'var(--default-bg-color)'
title = escape_html(title)
const className = postDesc ? 'pagination-related' : 'pagination-related no-desc'
result += `<a class="${className}" href="${url_for(path)}" title="${title}">`
if (cover_type === 'img') {
result += `<img class="cover" src="${url_for(cover)}" alt="cover">`
} else {
result += `<div class="cover" style="background: ${cover}"></div>`
}
if (dateType === 'created') {
result += `<div class="content is-center"><div class="date"><i class="far fa-calendar-alt fa-fw"></i> ${this.date(relatedPosts[i].created, hexoConfig.date_format)}</div>`
result += `<div class="info text-center"><div class="info-1"><div class="info-item-1"><i class="far fa-calendar-alt fa-fw"></i> ${date(created, hexoConfig.date_format)}</div>`
} else {
result += `<div class="content is-center"><div class="date"><i class="fas fa-history fa-fw"></i> ${this.date(relatedPosts[i].updated, hexoConfig.date_format)}</div>`
result += `<div class="info text-center"><div class="info-1"><div class="info-item-1"><i class="fas fa-history fa-fw"></i> ${date(updated, hexoConfig.date_format)}</div>`
}
result += `<div class="info-item-2">${title}</div></div>`
if (postDesc) {
result += `<div class="info-2"><div class="info-item-1">${postDesc}</div></div>`
}
result += `<div class="title">${title}</div>`
result += '</div></a>'
}

View File

@@ -44,7 +44,7 @@ addBorderRadius(x = 6, hide = false)
.postImgHover
&:hover
.cover
opacity: .7
opacity: .5
transform: scale(1.1)
.cover

View File

@@ -179,14 +179,11 @@ if $site-name-font
#aside-content .author-info-description
font-family: $site-name-font
.is-center
.text-center
text-align: center
.pull-left
float: left
.pull-right
float: right
.text-right
text-align: right
img
&[src=''],

View File

@@ -159,8 +159,8 @@
a
display: flex
flex-direction: row
padding: 2px 8px
margin: 2px 0
padding: 2px 8px
color: var(--font-color)
transition: all .3s
addBorderRadius()
@@ -354,11 +354,12 @@
.headline
@extend .limit-one-line
color: var(--font-color)
font-size: .95em
.length-num
margin-top: -.32em
margin-top: -.45em
color: var(--text-highlight-color)
font-size: 1.4em
font-size: 1.2em
@keyframes more-btn-move
0%,

View File

@@ -146,10 +146,11 @@
position: fixed
top: -60px
z-index: 91
background: rgba(255, 255, 255, .8)
background: rgba(255, 255, 255, .7)
box-shadow: 0 5px 6px -5px alpha($grey, .6)
transition: transform .2s ease-in-out, opacity .2s ease-in-out
will-change: transform
backdrop-filter: blur(7px)
#blog-info
color: var(--font-color)
@@ -430,6 +431,7 @@
background-color: lighten($theme-color, 30%)
content: ''
transition: all .3s ease-in-out
addBorderRadius()
&:hover
&:after

View File

@@ -8,49 +8,28 @@
background: $theme-paginator-color
color: var(--white)
.pagination-info
position: absolute
top: 50%
padding: 20px 40px
width: 100%
transform: translate(0, -50%)
.prev_info,
.next_info
@extend .limit-one-line
color: var(--white)
font-weight: 500
.next-post
.pagination-info
text-align: right
.pull-full
.full-width
width: 100% !important
.prev-post .label,
.next-post .label
color: var(--light-grey)
text-transform: uppercase
font-size: 90%
.prev-post,
.next-post
@extend .postImgHover
position: relative
display: block
overflow: hidden
.pagination-related
width: 50%
height: 150px
+maxWidth768()
width: 100%
.info-1
.info-item-2
-webkit-line-clamp: 1
.info-2
.info-item-1
-webkit-line-clamp: 2
&.pagination-post
overflow: hidden
margin-top: 40px
width: 100%
background: $dark-black
addBorderRadius()
.layout
@@ -74,4 +53,51 @@
margin-top: 30px
& > *:not(.space)
box-shadow: none
box-shadow: none
.pagination-related
position: relative
display: inline-block
overflow: hidden
background: $dark-black
vertical-align: bottom
@extend .postImgHover
&.next-post
.info
text-align: right
.info
.info-1,
.info-2
@extend .verticalCenter
padding: 20px 40px
color: var(--white)
transition: transform .3s, opacity .3s
.info-1
.info-item-1
color: var(--light-grey)
text-transform: uppercase
font-size: 90%
.info-item-2
@extend .limit-more-line
color: var(--white)
font-weight: 500
.info-2
opacity: 0
transform: translate(0, 0)
.info-item-1
@extend .limit-more-line
&:not(.no-desc):hover
.info-1
opacity: 0
transform: translate(0, -100%)
.info-2
opacity: 1
transform: translate(0, -50%)

View File

@@ -19,9 +19,9 @@ beautify()
&:before
position: absolute
top: calc(50% - 7px)
left: 0
color: $title-prefix-icon-color
content: $title-prefix-icon
left: 0
line-height: 1
transition: all .2s ease-out
@extend .fontawesomeIcon
@@ -65,7 +65,7 @@ beautify()
ul > li
list-style-type: circle
hr
@extend .custom-hr
@@ -119,16 +119,16 @@ beautify()
width: fit-content
a:not(.headerlink)
position relative
z-index 10
position: relative
z-index: 10
a.headerlink
position: absolute
top: 0
right: 0
left 0
bottom: 0
width 100%
left: 0
width: 100%
height: 100%
ol,

View File

@@ -8,15 +8,9 @@
& > .relatedPosts-list
& > a
position: relative
display: inline-block
overflow: hidden
margin: 3px
width: calc(33.333% - 6px)
height: 200px
background: $dark-black
vertical-align: bottom
@extend .postImgHover
addBorderRadius()
+maxWidth768()
@@ -27,15 +21,11 @@
+maxWidth600()
width: calc(100% - 4px)
.content
padding: 0 20px
@extend .verticalCenter
.info
.info-1
.info-item-2
-webkit-line-clamp: 2
.date
color: var(--light-grey)
font-size: 90%
.title
@extend .limit-more-line
color: var(--white)
-webkit-line-clamp: 2
.info-2
.info-item-1
-webkit-line-clamp: 3

View File

@@ -10,6 +10,7 @@
.shuoshuo-item-header
display: flex
align-items: center
cursor: default
.shuoshuo-avatar
overflow: hidden

View File

@@ -75,11 +75,11 @@
overflow-y: overlay
margin: 0 -20px
padding: 0 22px
max-height: calc(80vh - 240px)
max-height: calc(80vh - 220px)
+maxWidth768()
max-height: none
height: calc(var(--search-height) - 265px)
height: calc(var(--search-height) - 235px)
#algolia-info
div

View File

@@ -19,9 +19,6 @@
height: 100%
border-radius: 0
hr
margin: 20px auto
.search-nav
margin: 0 0 14px
color: $search-color
@@ -40,7 +37,7 @@
color: $search-color
hr
margin: 20px auto
margin: 15px auto
@extend .custom-hr
#search-mask

View File

@@ -19,30 +19,16 @@
display: none
.local-search-hit-item
position: relative
padding-left: 24px
line-height: 1.7
margin-left: 24px
padding-left: 3px
line-height: 1.8
&:hover
&:before
border-color: var(--pseudo-hover)
&:before
$w = .5em
position: absolute
top: .45em
left: 0
width: w = $w
height: h = w
border: 3px solid $search-color
border-radius: w
background: transparent
content: ''
line-height: h
transition: all .2s ease-in-out
&::marker
color: $search-color
font-weight: bold
font-style: italic
a
display: block
color: var(--search-a-color)
&:hover
@@ -53,17 +39,19 @@
.search-result
margin: 0 0 8px
word-break: break-all
font-size: .9em
.search-result-list
overflow-y: overlay
margin: 0 -20px
padding: 0 22px
max-height: calc(80vh - 200px)
max-height: calc(80vh - 180px)
+maxWidth768()
max-height: calc(var(--search-height) - 220px) !important
max-height: calc(var(--search-height) - 190px) !important
.search-keyword
background: transparent
color: $search-keyword-highlight
font-weight: bold
font-weight: 600

View File

@@ -206,7 +206,7 @@ document.addEventListener('DOMContentLoaded', () => {
const altValue = item.title || item.alt
if (!altValue) return
const ele = document.createElement('div')
ele.className = 'img-alt is-center'
ele.className = 'img-alt text-center'
ele.textContent = altValue
item.insertAdjacentElement('afterend', ele)
})

View File

@@ -150,16 +150,16 @@ class LocalSearch {
url.searchParams.append('highlight', keywords.join(' '))
if (slicesOfTitle.length !== 0) {
resultItem += `<div class="local-search-hit-item"><a href="${url.href}"><span class="search-result-title">${this.highlightKeyword(title, slicesOfTitle[0])}</span>`
resultItem += `<li class="local-search-hit-item"><a href="${url.href}"><span class="search-result-title">${this.highlightKeyword(title, slicesOfTitle[0])}</span>`
} else {
resultItem += `<div class="local-search-hit-item"><a href="${url.href}"><span class="search-result-title">${title}</span>`
resultItem += `<li class="local-search-hit-item"><a href="${url.href}"><span class="search-result-title">${title}</span>`
}
slicesOfContent.forEach(slice => {
resultItem += `<p class="search-result">${this.highlightKeyword(content, slice)}...</p></a>`
})
resultItem += '</div>'
resultItem += '</li>'
resultItems.push({
item: resultItem,
id: resultItems.length,
@@ -281,7 +281,7 @@ window.addEventListener('load', () => {
const stats = languages.hits_stats.replace(/\$\{hits}/, resultItems.length)
container.innerHTML = `<div class="search-result-list">${resultItems.map(result => result.item).join('')}</div>`
container.innerHTML = `<ol class="search-result-list">${resultItems.map(result => result.item).join('')}</ol>`
statsItem.innerHTML = `<hr><div class="search-result-stats">${stats}</div>`
window.pjax && window.pjax.refresh(container)
}