diff --git a/_config.yml b/_config.yml index deb3c75..96bbe9a 100644 --- a/_config.yml +++ b/_config.yml @@ -776,7 +776,7 @@ snackbar: enable: false position: bottom-left bg_light: '#49b1f5' # The background color of Toast Notification in light mode - bg_dark: '#121212' # The background color of Toast Notification in dark mode + bg_dark: '#1f1f1f' # The background color of Toast Notification in dark mode # https://instant.page/ # prefetch (預加載) @@ -894,7 +894,7 @@ CDN: ClickShowText: # fontawesome - fontawesome: + fontawesomeV6: # Conversion between Traditional and Simplified Chinese translate: diff --git a/languages/default.yml b/languages/default.yml index 8cb0020..2b2a551 100644 --- a/languages/default.yml +++ b/languages/default.yml @@ -103,6 +103,7 @@ rightside: scroll_to_comment: Scroll To Comments setting: Setting aside: Toggle between single-column and double-column + chat: Chat copy_copyright: author: Author diff --git a/languages/en.yml b/languages/en.yml index dc31ed7..323d9f4 100644 --- a/languages/en.yml +++ b/languages/en.yml @@ -103,6 +103,7 @@ rightside: scroll_to_comment: Scroll To Comments setting: Setting aside: Toggle between single-column and double-column + chat: Chat copy_copyright: author: Author diff --git a/languages/zh-CN.yml b/languages/zh-CN.yml index f3460b1..db3d2b9 100644 --- a/languages/zh-CN.yml +++ b/languages/zh-CN.yml @@ -104,6 +104,7 @@ rightside: scroll_to_comment: 直达评论 setting: 设置 aside: 单栏和双栏切换 + chat: 聊天 copy_copyright: author: 作者 diff --git a/languages/zh-TW.yml b/languages/zh-TW.yml index 1019eb7..81a3615 100644 --- a/languages/zh-TW.yml +++ b/languages/zh-TW.yml @@ -104,6 +104,7 @@ rightside: scroll_to_comment: 直達評論 setting: 設定 aside: 單欄和雙欄切換 + chat: 聊天 copy_copyright: author: 作者 diff --git a/layout/includes/head.pug b/layout/includes/head.pug index 5263e35..748684c 100644 --- a/layout/includes/head.pug +++ b/layout/includes/head.pug @@ -47,7 +47,7 @@ if (theme.pwa && theme.pwa.enable) //- main css link(rel='stylesheet', href=url_for(theme.CDN.main_css)) -link(rel='stylesheet', href=url_for(theme.CDN.fontawesome) media="print" onload="this.media='all'") +link(rel='stylesheet', href=url_for(theme.CDN.fontawesomeV6) media="print" onload="this.media='all'") if (theme.snackbar && theme.snackbar.enable) link(rel='stylesheet', href=url_for(theme.CDN.snackbar_css) media="print" onload="this.media='all'") diff --git a/layout/includes/rightside.pug b/layout/includes/rightside.pug index 39a742b..9696d0b 100644 --- a/layout/includes/rightside.pug +++ b/layout/includes/rightside.pug @@ -23,7 +23,7 @@ mixin rightsideItem(array) i.fas.fa-list-ul when 'chat' if chat_btn - button#chat_btn(type="button" title=_p("rightside.chat_btn")) + button#chat_btn(type="button" title=_p("rightside.chat")) i.fas.fa-sms when 'comment' if commentsJsLoad diff --git a/layout/includes/third-party/comments/facebook_comments.pug b/layout/includes/third-party/comments/facebook_comments.pug index 54807cc..c1ae68d 100644 --- a/layout/includes/third-party/comments/facebook_comments.pug +++ b/layout/includes/third-party/comments/facebook_comments.pug @@ -7,7 +7,7 @@ script. if (typeof FB === 'object') FB.XFBML.parse() else { let ele = document.createElement('script') - ele.setAttribute('src','https://connect.facebook.net/!{theme.facebook_comments.lang}/sdk.js#xfbml=1&version=v11.0') + ele.setAttribute('src','https://connect.facebook.net/!{theme.facebook_comments.lang}/sdk.js#xfbml=1&version=v13.0&autoLogAppEvents=1') ele.setAttribute('async', 'true') ele.setAttribute('defer', 'true') ele.setAttribute('crossorigin', 'anonymous') diff --git a/layout/includes/widget/card_announcement.pug b/layout/includes/widget/card_announcement.pug index a38b7b9..9e63627 100644 --- a/layout/includes/widget/card_announcement.pug +++ b/layout/includes/widget/card_announcement.pug @@ -1,6 +1,6 @@ if theme.aside.card_announcement.enable .card-widget.card-announcement .item-headline - i.fas.fa-bullhorn.card-announcement-animation + i.fas.fa-bullhorn.fa-shake span= _p('aside.card_announcement') .announcement_content!= theme.aside.card_announcement.content \ No newline at end of file diff --git a/layout/post.pug b/layout/post.pug index a5399b2..f54ab7a 100644 --- a/layout/post.pug +++ b/layout/post.pug @@ -14,7 +14,7 @@ block content a(href=url_for(item.path)).post-meta__tags #[=item.name] include includes/third-party/share/index.pug - if theme.reward.enable + if theme.reward.enable && theme.reward.QR_code !=partial('includes/post/reward', {}, {cache: true}) //- ad diff --git a/package.json b/package.json index b2fdeb6..0caf766 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "hexo-theme-butterfly", - "version": "4.0.1", + "version": "4.1.0", "description": "A Simple and Card UI Design theme for Hexo", "main": "package.json", "scripts": { @@ -24,7 +24,7 @@ }, "dependencies": { "hexo-renderer-stylus": "^2.0.1", - "hexo-renderer-pug": "^2.0.0" + "hexo-renderer-pug": "^3.0.0" }, "homepage": "https://butterfly.js.org/", "author": "Jerry ", diff --git a/scripts/events/config.js b/scripts/events/config.js index 8c680cf..33e663c 100644 --- a/scripts/events/config.js +++ b/scripts/events/config.js @@ -80,7 +80,7 @@ hexo.extend.filter.register('before_generate', () => { ClickShowText: 'https://cdn.jsdelivr.net/npm/butterfly-extsrc@1/dist/click-show-text.min.js', // fontawesome - fontawesome: 'https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free/css/all.min.css', + fontawesomeV6: 'https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@6/css/all.min.css', // Conversion between Traditional and Simplified Chinese translate: '/js/tw_cn.js', @@ -122,7 +122,7 @@ hexo.extend.filter.register('before_generate', () => { use = use.split(',') } - const newArray = use.map(item => item.toLowerCase().replace(/^\S/, s => s.toUpperCase())) + const newArray = use.map(item => item.toLowerCase().replace(/\b[a-z]/g, s => s.toUpperCase())) themeConfig.comments.use = newArray }) diff --git a/scripts/events/welcome.js b/scripts/events/welcome.js index f6650f9..77eb662 100644 --- a/scripts/events/welcome.js +++ b/scripts/events/welcome.js @@ -12,6 +12,6 @@ hexo.on('ready', () => { # # # # # # # # # # # # ##### #### # # ###### # # # ###### # - ${version} + ${version} ===================================================================`) }) diff --git a/scripts/tag/flink.js b/scripts/tag/flink.js new file mode 100644 index 0000000..e41a52f --- /dev/null +++ b/scripts/tag/flink.js @@ -0,0 +1,39 @@ +/** + * flink + */ + +'use strict' + +const urlFor = require('hexo-util').url_for.bind(hexo) + +const flinkFn = (args, content) => { + content = hexo.render.renderSync({ text: content, engine: 'yaml' }) + + let result = '' + + content.forEach(i => { + const className = i.class_name ? `` : '' + const classDesc = i.class_desc ? `` : '' + + let listResult = '' + + i.link_list.forEach(j => { + listResult += ` + ` + }) + + result += `${className}${classDesc} ` + }) + + return `` +} + +hexo.extend.tag.register('flink', flinkFn, { ends: true }) diff --git a/scripts/tag/hide.js b/scripts/tag/hide.js index 996ad2b..ccf9365 100644 --- a/scripts/tag/hide.js +++ b/scripts/tag/hide.js @@ -62,8 +62,7 @@ function hideToggle (args, content) { if (color) group += `color: ${color}` group += '"' - return `
${display}
-
${hexo.render.renderSync({ text: content, engine: 'markdown' })}
` + return `
${display}
${hexo.render.renderSync({ text: content, engine: 'markdown' })}
` } hexo.extend.tag.register('hideInline', hideInline) diff --git a/source/css/_global/function.styl b/source/css/_global/function.styl index 771196d..7bc8d56 100644 --- a/source/css/_global/function.styl +++ b/source/css/_global/function.styl @@ -11,9 +11,7 @@ .fontawesomeIcon display: inline-block font-weight: 600 - font-style: normal - font-variant: normal - font-family: 'Font Awesome 5 Free' + font-family: 'Font Awesome 6 Free' text-rendering: auto -webkit-font-smoothing: antialiased @@ -55,7 +53,7 @@ li position: relative - padding 0.12em 0.4em 0.12em 1.4em + padding: .12em .4em .12em 1.4em &:hover &:before @@ -133,11 +131,7 @@ if hexo-config('enter_transitions') &.open for i in 1 2 3 4 > :nth-child({i}) - animation: sidebarItem (i / 5)s - -.card-announcement-animation - color: #FF0000 - animation: announ_animation .8s linear infinite + animation: sidebarItem (i / 5) s .scroll-down-effects animation: scroll-down-effect 1.5s infinite @@ -251,14 +245,6 @@ if hexo-config('avatar.effect') == true opacity: 1 transform: translateY(0) -@keyframes announ_animation - 0%, - to - transform: scale(1) - - 50% - transform: scale(1.2) - @keyframes sidebarItem 0% transform: translateX(200px) diff --git a/source/css/_highlight/highlight.styl b/source/css/_highlight/highlight.styl index 4271288..a0a1635 100644 --- a/source/css/_highlight/highlight.styl +++ b/source/css/_highlight/highlight.styl @@ -96,7 +96,7 @@ $code-block transition: transform .3s & + .code-lang - left: 1.6em + left: 1.7em &.closed transition: all .3s @@ -112,7 +112,7 @@ $code-block .copy-notice position: absolute - right: 2.1em + right: 2.4em opacity: 0 transition: opacity .4s @@ -160,7 +160,7 @@ $code-block transform: rotate(90deg) !important & ~ .copy-notice - right: 3.3em + right: 3.45em & ~ .copy-button right: 2.1em diff --git a/source/css/_layout/aside.styl b/source/css/_layout/aside.styl index 659ac5f..abb48b4 100644 --- a/source/css/_layout/aside.styl +++ b/source/css/_layout/aside.styl @@ -319,6 +319,11 @@ &:hover animation: more-btn-move 1s infinite + .card-announcement + .item-headline + i + color: #FF0000 + .avatar-img overflow: hidden margin: 0 auto diff --git a/source/css/_layout/pagination.styl b/source/css/_layout/pagination.styl index a9a4a24..6d729e3 100644 --- a/source/css/_layout/pagination.styl +++ b/source/css/_layout/pagination.styl @@ -51,6 +51,7 @@ &.pagination-post overflow: hidden margin-top: 40px + width: 100% background: $dark-black .layout diff --git a/source/css/_layout/post.styl b/source/css/_layout/post.styl index 83c6cec..e301801 100644 --- a/source/css/_layout/post.styl +++ b/source/css/_layout/post.styl @@ -174,7 +174,7 @@ beautify() .post_share display: inline-block float: right - margin: 8px 0 + margin: 8px 0 20px width: fit-content .social-share diff --git a/source/css/_layout/third-party.styl b/source/css/_layout/third-party.styl index 5444fc4..8f52548 100644 --- a/source/css/_layout/third-party.styl +++ b/source/css/_layout/third-party.styl @@ -65,6 +65,9 @@ if hexo-config('waline.bg') margin: 0 0 20px text-align: center + & > svg + height: 100% + .utterances, .fb-comments iframe width: 100% !important @@ -105,4 +108,7 @@ mjx-container[display], padding: 0 15px &:before - content: none \ No newline at end of file + content: none + +.snackbar-css + border-radius: 5px !important \ No newline at end of file diff --git a/source/css/_mode/darkmode.styl b/source/css/_mode/darkmode.styl index 3f9ec5a..f24a258 100644 --- a/source/css/_mode/darkmode.styl +++ b/source/css/_mode/darkmode.styl @@ -142,3 +142,7 @@ if hexo-config('darkmode.enable') || hexo-config('display_mode') == 'dark' #operare_artitalk .c2 background: #121212 + + #card-toc + +maxWidth900() + background: lighten(#121212, 5) \ No newline at end of file diff --git a/source/css/_page/flink.styl b/source/css/_page/flink.styl index d1cad61..57dd50a 100644 --- a/source/css/_page/flink.styl +++ b/source/css/_page/flink.styl @@ -1,5 +1,7 @@ #article-container .flink + margin-bottom: 20px + .flink-list overflow: auto padding: 10px 10px 0 @@ -23,8 +25,9 @@ width: calc(100% - 15px) !important &:hover - img - transform: rotate(360deg) + .flink-item-icon + margin-left: -10px + width: 0 &:before position: absolute @@ -54,25 +57,31 @@ width: 60px height: 60px border-radius: 35px + transition: width .3s ease-out img width: 100% height: 100% + transition: filter 375ms ease-in .2s, transform .3s object-fit: cover - transition: filter 375ms ease-in 0.2s, transform .3s .img-alt display: none - .flink-item-name - @extend .limit-one-line - padding: 16px 10px 0 0 - height: 40px - font-weight: bold - font-size: 1.43em + .flink-item-name + @extend .limit-one-line + padding: 16px 10px 0 0 + height: 40px + font-weight: bold + font-size: 1.43em - .flink-item-desc - @extend .limit-one-line - padding: 16px 10px 16px 0 - height: 50px - font-size: .93em + .flink-item-desc + @extend .limit-one-line + padding: 16px 10px 16px 0 + height: 50px + font-size: .93em + + .flink-name + margin-bottom: 5px + font-weight: bold + font-size: 1.5em \ No newline at end of file diff --git a/source/css/_tags/hide.styl b/source/css/_tags/hide.styl index e596700..2442e93 100644 --- a/source/css/_tags/hide.styl +++ b/source/css/_tags/hide.styl @@ -3,7 +3,7 @@ .hide-block & > .hide-button display: inline-block - padding: 6px 20px + padding: 5px 18px background: $tag-hide-bg color: var(--white) @@ -32,27 +32,15 @@ .hide-block margin: 0 0 16px -.hide-toggle +.toggle margin-bottom: 20px border: 1px solid $tag-hide-toggle-bg - & > .hide-button - padding: 6px 10px + & > .toggle-button + padding: 6px 15px background: $tag-hide-toggle-bg color: #1F2D3D cursor: pointer - & > i - font-size: 1.2em - transition: all .3s - - &.open - i - transform: rotate(90deg) - - & + div - display: block - - & > .hide-content - display: none + & > .toggle-content margin: 30px 24px diff --git a/source/js/main.js b/source/js/main.js index 54788cd..dee553e 100644 --- a/source/js/main.js +++ b/source/js/main.js @@ -361,7 +361,9 @@ document.addEventListener('DOMContentLoaded', function () { // toc元素點擊 $cardToc.addEventListener('click', e => { e.preventDefault() - const $target = e.target.classList.contains('toc-link') + const target = e.target.classList + if (target.contains('toc-content')) return + const $target = target.contains('toc-link') ? e.target : e.target.parentElement btf.scrollToDest(btf.getEleTop(document.getElementById(decodeURI($target.getAttribute('href')).replace('#', ''))), 300) @@ -613,13 +615,9 @@ document.addEventListener('DOMContentLoaded', function () { $hideInline.forEach(function (item) { item.addEventListener('click', function (e) { const $this = this - const $hideContent = $this.nextElementSibling - $this.classList.toggle('open') - if ($this.classList.contains('open')) { - if ($hideContent.querySelectorAll('.fj-gallery').length > 0) { - btf.initJustifiedGallery($hideContent.querySelectorAll('.fj-gallery')) - } - } + $this.classList.add('open') + const $fjGallery = $this.nextElementSibling.querySelectorAll('.fj-gallery') + $fjGallery.length && btf.initJustifiedGallery($fjGallery) }) }) } diff --git a/source/js/search/local-search.js b/source/js/search/local-search.js index de2db62..2d207d5 100644 --- a/source/js/search/local-search.js +++ b/source/js/search/local-search.js @@ -56,7 +56,7 @@ window.addEventListener('load', () => { datas = [...a.querySelectorAll('entry')].map(function (item) { return { title: item.querySelector('title').textContent, - content: item.querySelector('content').textContent, + content: item.querySelector('content') && item.querySelector('content').textContent, url: item.querySelector('url').textContent } }) @@ -76,15 +76,12 @@ window.addEventListener('load', () => { $resultContent.innerHTML = '' let str = '
' - if (this.value.trim().length <= 0) return + if (keywords.length <= 0) return let count = 0 // perform local searching datas.forEach(function (data) { let isMatch = true - if (!data.title || data.title.trim() === '') { - data.title = '' - } - let dataTitle = data.title.trim().toLowerCase() + let dataTitle = data.title ? data.title.trim().toLowerCase() : '' const dataContent = data.content ? data.content.trim().replace(/<[^>]+>/g, '').toLowerCase() : '' const dataUrl = data.url.startsWith('/') ? data.url : GLOBAL_CONFIG.root + data.url let indexTitle = -1 @@ -112,11 +109,10 @@ window.addEventListener('load', () => { // show search results if (isMatch) { - const content = data.content.trim().replace(/<[^>]+>/g, '') if (firstOccur >= 0) { // cut out 130 characters // let start = firstOccur - 30 < 0 ? 0 : firstOccur - 30 - // let end = firstOccur + 50 > content.length ? content.length : firstOccur + 50 + // let end = firstOccur + 50 > dataContent.length ? dataContent.length : firstOccur + 50 let start = firstOccur - 30 let end = firstOccur + 100 @@ -128,11 +124,11 @@ window.addEventListener('load', () => { end = 100 } - if (end > content.length) { - end = content.length + if (end > dataContent.length) { + end = dataContent.length } - let matchContent = content.substring(start, end) + let matchContent = dataContent.substring(start, end) // highlight all keywords keywords.forEach(function (keyword) { diff --git a/source/js/utils.js b/source/js/utils.js index b3e5df0..a1be368 100644 --- a/source/js/utils.js +++ b/source/js/utils.js @@ -66,7 +66,8 @@ const btf = { backgroundColor: bg, showAction: showAction, duration: duration, - pos: position + pos: position, + customClass: 'snackbar-css' }) },