mirror of
https://github.com/jerryc127/hexo-theme-butterfly.git
synced 2026-04-10 21:17:07 +08:00
Compare commits
29 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
101cb45b90 | ||
|
|
641fb56b22 | ||
|
|
7c859ef66d | ||
|
|
42bc175718 | ||
|
|
bbb9beb8f9 | ||
|
|
eca1487a5e | ||
|
|
3f796adc88 | ||
|
|
32b83a0d81 | ||
|
|
ad87304302 | ||
|
|
7b520c62f6 | ||
|
|
026a348482 | ||
|
|
829a3dbf32 | ||
|
|
54c6a509c7 | ||
|
|
c214da4515 | ||
|
|
de4037106b | ||
|
|
f0eaf2d8b0 | ||
|
|
9e6958f25b | ||
|
|
36527a3b81 | ||
|
|
c439930786 | ||
|
|
f4e5cef399 | ||
|
|
92121d7bbe | ||
|
|
aced08c860 | ||
|
|
4e1cb0b2b5 | ||
|
|
aa7173fc69 | ||
|
|
597f0d2019 | ||
|
|
c48ce9af8c | ||
|
|
531269c60e | ||
|
|
6057297f44 | ||
|
|
4b381350a1 |
11
README.md
11
README.md
@@ -12,6 +12,8 @@
|
||||

|
||||

|
||||
|
||||

|
||||
|
||||
Demo: 👍 [Butterfly](https://butterfly.js.org/) || 🤞 [MYW](https://immyw.com/)
|
||||
|
||||
Docs: 📖 [Butterfly Docs](https://butterfly.js.org/posts/21cfbf15/)
|
||||
@@ -80,9 +82,9 @@ npm i hexo-theme-butterfly
|
||||
- [X] Comment (Disqus/Disqusjs/Livere/Gitalk/Valine/Waline/Utterances/Facebook Comments/Twikoo)
|
||||
- [x] Multiple Comment System Support
|
||||
- [x] Online Chats (Chatra/Tidio/Daovoice/Gitter/Crisp)
|
||||
- [x] Web analytics (Baidu Analytics/Google Analytics/Tencent Analytics/CNZZ Analytics)
|
||||
- [x] Web analytics
|
||||
- [x] Google AdSense
|
||||
- [x] Webmaster Verification (google/Bing/Baidu/360/Yandex)
|
||||
- [x] Webmaster Verification
|
||||
- [x] Change website colour scheme
|
||||
- [x] Typewriter Effect: activate_power_mode
|
||||
- [x] Background effects (Canvas ribbon/canvas_ribbon_piao/canvas_nest)
|
||||
@@ -97,6 +99,9 @@ npm i hexo-theme-butterfly
|
||||
|
||||
## Screenshots
|
||||
|
||||

|
||||

|
||||

|
||||

|
||||

|
||||
|
||||

|
||||
@@ -12,6 +12,8 @@
|
||||

|
||||

|
||||
|
||||

|
||||
|
||||
預覽: 👍 [Butterfly](https://butterfly.js.org/) || 🤞 [MYW](https://immyw.com/)
|
||||
|
||||
文檔: 📖 [Butterfly Docs](https://butterfly.js.org/posts/21cfbf15/)
|
||||
@@ -79,7 +81,7 @@ theme: butterfly
|
||||
- [X] 多種評論系統(Disqus/Disqusjs/Livere/Gitalk/Valine/Waline/Utterances/Facebook Comments/Twikoo)
|
||||
- [x] 支持雙評論部署
|
||||
- [x] 多種在線聊天(Chatra/Tidio/Daovoice/Gitter/Crisp)
|
||||
- [x] 多種分析系統(百度分析/谷歌分析/騰訊分析/CNZZ分析)
|
||||
- [x] 多種分析系統
|
||||
- [x] 谷歌廣告/手動廣告位置
|
||||
- [x] 各種站長驗證(Google/Bing/Baidu/360/Yandex)
|
||||
- [x] 修改網站配色
|
||||
@@ -96,6 +98,9 @@ theme: butterfly
|
||||
|
||||
## 截圖
|
||||
|
||||

|
||||

|
||||

|
||||

|
||||

|
||||
|
||||

|
||||
48
_config.yml
48
_config.yml
@@ -4,7 +4,7 @@
|
||||
# format: name: link || icon
|
||||
# sub-menu
|
||||
# name || icon:
|
||||
# name || link || icon
|
||||
# name: link || icon
|
||||
|
||||
menu:
|
||||
# Home: / || fas fa-home
|
||||
@@ -274,6 +274,7 @@ comments:
|
||||
# https://disqus.com/
|
||||
disqus:
|
||||
shortname:
|
||||
apikey: # For newest comments widget
|
||||
|
||||
# Alternative Disqus - Render comments with Disqus API
|
||||
# DisqusJS 評論系統,可以實現在網路審查地區載入 Disqus 評論列表,兼容原版
|
||||
@@ -331,7 +332,7 @@ valine:
|
||||
waline:
|
||||
serverURL: # Waline server address url
|
||||
avatar: monsterid # gravatar style https://zh-tw.gravatar.com/site/implement/images/#default-image
|
||||
emojiCDN: # emoji CDN
|
||||
avatarCDN: # Gravatar CDN baseURL
|
||||
bg: # waline background
|
||||
visitor: false
|
||||
option:
|
||||
@@ -459,25 +460,11 @@ google_adsense:
|
||||
# Verification (站長驗證)
|
||||
# --------------------------------------
|
||||
|
||||
# Google Webmaster tools verification setting
|
||||
# See: https://www.google.com/webmasters/
|
||||
google_site_verification:
|
||||
|
||||
# Bing Webmaster tools verification setting
|
||||
# See: https://www.bing.com/webmaster/
|
||||
bing_site_verification:
|
||||
|
||||
# Baidu Webmaster tools verification setting
|
||||
# See: https://ziyuan.baidu.com/site/
|
||||
baidu_site_verification:
|
||||
|
||||
# 360 Webmaster tools verification setting
|
||||
# see http://zhanzhang.so.com/
|
||||
qihu_site_verification:
|
||||
|
||||
# Yandex Webmaster tools verification setting
|
||||
# see https://webmaster.yandex.com/
|
||||
yandex_site_verification:
|
||||
site_verification:
|
||||
# - name: google-site-verification
|
||||
# content: xxxxxx
|
||||
# - name: baidu-site-verification
|
||||
# content: xxxxxxx
|
||||
|
||||
# Beautify/Effect (美化/效果)
|
||||
# --------------------------------------
|
||||
@@ -708,17 +695,6 @@ newest_comments:
|
||||
limit: 6
|
||||
storage: 10 # unit: mins, save data to localStorage
|
||||
avatar: true
|
||||
# You can only choose one, or neither
|
||||
valine: false
|
||||
github_issues:
|
||||
enable: false
|
||||
repo:
|
||||
disqus:
|
||||
enable: false
|
||||
forum:
|
||||
api_key:
|
||||
twikoo: false
|
||||
waline: false
|
||||
|
||||
# Bottom right button (右下角按鈕)
|
||||
# --------------------------------------
|
||||
@@ -770,7 +746,7 @@ fancybox: true
|
||||
# --------------------------------------
|
||||
|
||||
# mermaid
|
||||
# see https://github.com/knsv/mermaid
|
||||
# see https://github.com/mermaid-js/mermaid
|
||||
mermaid:
|
||||
enable: false
|
||||
# built-in themes: default/forest/dark/neutral
|
||||
@@ -828,10 +804,12 @@ pangu:
|
||||
field: site # site/post
|
||||
|
||||
# Lazyload (圖片懶加載)
|
||||
# https://github.com/verlok/lazyload
|
||||
# https://github.com/verlok/vanilla-lazyload
|
||||
lazyload:
|
||||
enable: false
|
||||
post: /img/loading.gif
|
||||
field: site # site/post
|
||||
placeholder:
|
||||
blur: false
|
||||
|
||||
# PWA
|
||||
# See https://github.com/JLHwung/hexo-offline
|
||||
|
||||
@@ -1,28 +0,0 @@
|
||||
- var top_img = theme.error_404.background || theme.default_top_img
|
||||
- var bg_img = `background-image: url('${url_for(top_img)}')`
|
||||
|
||||
doctype html
|
||||
html(lang=config.language data-theme=theme.display_mode)
|
||||
head
|
||||
include includes/head.pug
|
||||
body
|
||||
if theme.preloader
|
||||
!=partial('includes/loading/loading', {}, {cache: true})
|
||||
|
||||
if theme.fireworks && theme.fireworks.enable
|
||||
canvas.fireworks
|
||||
|
||||
if theme.background
|
||||
#web_bg
|
||||
|
||||
#error-wrap
|
||||
.error-content
|
||||
.error-img(style=bg_img)
|
||||
.error-info
|
||||
h1.error_title= '404'
|
||||
.error_subtitle= theme.error_404.subtitle
|
||||
a.button--animated(href=config.root)
|
||||
i.fas.fa-rocket
|
||||
= _p('error404.back_button')
|
||||
|
||||
include includes/additional-js.pug
|
||||
17
layout/includes/404.pug
Normal file
17
layout/includes/404.pug
Normal file
@@ -0,0 +1,17 @@
|
||||
- var top_img = theme.error_404.background || theme.default_top_img
|
||||
- var bg_img = `background-image: url('${url_for(top_img)}')`
|
||||
|
||||
#body-wrap.error404
|
||||
div(style='display: none')
|
||||
include ./header/index.pug
|
||||
|
||||
#error-wrap
|
||||
.error-content
|
||||
.error-img(style=bg_img)
|
||||
.error-info
|
||||
h1.error_title= '404'
|
||||
.error_subtitle= theme.error_404.subtitle
|
||||
a.button--animated(href=config.root)
|
||||
i.fas.fa-rocket
|
||||
= _p('error404.back_button')
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
- var pageTitle
|
||||
- if (is_archive()) pageTitle = _p('page.archives')
|
||||
- if (is_archive()) pageTitle = fragment_cache('findArchivesTitle', function(){return findArchivesTitle(theme.menu);})
|
||||
- else if (is_tag()) pageTitle = _p('page.tag') + ': ' + page.tag
|
||||
- else if (is_category()) pageTitle = _p('page.category') + ': ' + page.category
|
||||
- else if (is_month()) pageTitle += ': ' + page.month + '/' + page.year
|
||||
|
||||
@@ -6,14 +6,16 @@
|
||||
|
||||
var pageToc = page.toc === true || page.toc === false ? page.toc : theme.toc.enable
|
||||
var showToc = is_post() && theme.aside.enable && pageToc && (toc(page.content) !== '' || page.encrypt == true )
|
||||
|
||||
let titleVal = pageTitle.replace(/'/ig,"\\'")
|
||||
-
|
||||
|
||||
script#config-diff
|
||||
.
|
||||
var GLOBAL_CONFIG_SITE = {
|
||||
isPost: !{is_post()},
|
||||
isHome: !{is_home()},
|
||||
isHighlightShrink: !{isHighlightShrink},
|
||||
isToc: !{showToc},
|
||||
postUpdate: '!{full_date(page.updated)}'
|
||||
}
|
||||
script#config-diff.
|
||||
var GLOBAL_CONFIG_SITE = {
|
||||
title: '!{titleVal}',
|
||||
isPost: !{is_post()},
|
||||
isHome: !{is_home()},
|
||||
isHighlightShrink: !{isHighlightShrink},
|
||||
isToc: !{showToc},
|
||||
postUpdate: '!{full_date(page.updated)}'
|
||||
}
|
||||
|
||||
@@ -1,14 +1,3 @@
|
||||
if theme.google_site_verification
|
||||
meta(name="google-site-verification" content=theme.google_site_verification)
|
||||
|
||||
if theme.bing_site_verification
|
||||
meta(name="msvalidate.01" content=theme.bing_site_verification)
|
||||
|
||||
if theme.baidu_site_verification
|
||||
meta(name="baidu-site-verification" content=theme.baidu_site_verification)
|
||||
|
||||
if theme.qihu_site_verification
|
||||
meta(name="360-site-verification" content=theme.qihu_site_verification)
|
||||
|
||||
if theme.yandex_site_verification
|
||||
meta(name="yandex-verification" content=theme.yandex_site_verification)
|
||||
if theme.site_verification
|
||||
each item in theme.site_verification
|
||||
meta(name=item.name content=item.content)
|
||||
@@ -19,7 +19,7 @@ if !theme.disable_top_img && page.top_img !== false
|
||||
if top_img !== false
|
||||
- var imgSource = top_img && top_img.indexOf('/') !== -1 ? `background-image: url('${url_for(top_img)}')` : `background: ${top_img}`
|
||||
- var bg_img = top_img ? imgSource : ''
|
||||
- var site_title = is_archive() ? _p('page.archives') : page.title || page.tag || page.category || config.title
|
||||
- var site_title = is_archive() ? fragment_cache('findArchivesTitle', function(){return findArchivesTitle(theme.menu);}) : page.title || page.tag || page.category || config.title
|
||||
- var isHomeClass = is_home() ? 'full_page' : 'not-home-page'
|
||||
- is_post() ? isHomeClass = 'post-bg' : isHomeClass
|
||||
else
|
||||
|
||||
@@ -15,28 +15,32 @@ html(lang=config.language data-theme=theme.display_mode class=htmlClassHideAside
|
||||
|
||||
!=partial('includes/sidebar', {}, {cache: true})
|
||||
|
||||
#body-wrap(class=pageType)
|
||||
include ./header/index.pug
|
||||
if page.type !== '404'
|
||||
#body-wrap(class=pageType)
|
||||
include ./header/index.pug
|
||||
|
||||
main#content-inner.layout(class=hideAside)
|
||||
if body
|
||||
div!= body
|
||||
main#content-inner.layout(class=hideAside)
|
||||
if body
|
||||
div!= body
|
||||
else
|
||||
block content
|
||||
if theme.aside.enable && page.aside !== false
|
||||
include widget/index.pug
|
||||
|
||||
- var footerBg = theme.footer_bg
|
||||
if (footerBg)
|
||||
if (footerBg === true)
|
||||
- var footer_bg = bg_img
|
||||
else
|
||||
- var footer_bg = theme.footer_bg.indexOf('/') !== -1 ? `background-image: url('${url_for(footerBg)}')` : `background: ${footerBg}`
|
||||
else
|
||||
block content
|
||||
if theme.aside.enable && page.aside !== false
|
||||
include widget/index.pug
|
||||
- var footer_bg = ''
|
||||
|
||||
- var footerBg = theme.footer_bg
|
||||
if (footerBg)
|
||||
if (footerBg === true)
|
||||
- var footer_bg = bg_img
|
||||
else
|
||||
- var footer_bg = theme.footer_bg.indexOf('/') !== -1 ? `background-image: url('${url_for(footerBg)}')` : `background: ${footerBg}`
|
||||
else
|
||||
- var footer_bg = ''
|
||||
footer#footer(style=footer_bg)
|
||||
!=partial('includes/footer', {}, {cache: true})
|
||||
|
||||
footer#footer(style=footer_bg)
|
||||
!=partial('includes/footer', {}, {cache: true})
|
||||
else
|
||||
include ./404.pug
|
||||
|
||||
include ./rightside.pug
|
||||
!=partial('includes/third-party/search/index', {}, {cache: true})
|
||||
|
||||
@@ -11,10 +11,7 @@ mixin articleSort(posts)
|
||||
.article-sort-item(class=no_cover)
|
||||
if article.cover && theme.cover.archives_enable
|
||||
a.article-sort-item-img(href=url_for(article.path) title=title)
|
||||
if theme.lazyload.enable
|
||||
img(data-lazy-src=url_for(article.cover) alt=title onerror=`this.onerror=null;this.src='${url_for(theme.error_img.post_page)}'`)
|
||||
else
|
||||
img(src=url_for(article.cover) alt=title onerror=`this.onerror=null;this.src='${url_for(theme.error_img.post_page)}'`)
|
||||
img(src=url_for(article.cover) alt=title onerror=`this.onerror=null;this.src='${url_for(theme.error_img.post_page)}'`)
|
||||
.article-sort-item-info
|
||||
.article-sort-item-time
|
||||
i.far.fa-calendar-alt
|
||||
|
||||
@@ -9,10 +9,7 @@ mixin postUI(posts)
|
||||
if post_cover && theme.cover.index_enable
|
||||
.post_cover(class=leftOrRight)
|
||||
a(href=url_for(link) title=title)
|
||||
if theme.lazyload.enable
|
||||
img.post_bg(data-lazy-src=url_for(post_cover) onerror=`this.onerror=null;this.src='`+ url_for(theme.error_img.post_page) + `'` alt=title)
|
||||
else
|
||||
img.post_bg(src=url_for(post_cover) onerror=`this.onerror=null;this.src='`+ url_for(theme.error_img.post_page) + `'` alt=title)
|
||||
img.post_bg(src=url_for(post_cover) onerror=`this.onerror=null;this.src='`+ url_for(theme.error_img.post_page) + `'` alt=title)
|
||||
.recent-post-info(class=no_cover)
|
||||
a.article-title(href=url_for(link) title=title)= title
|
||||
.article-meta-wrap
|
||||
|
||||
@@ -13,11 +13,9 @@
|
||||
each item in i.link_list
|
||||
.flink-list-item
|
||||
a(href=url_for(item.link) title=item.name target="_blank")
|
||||
if theme.lazyload.enable
|
||||
img(data-lazy-src=url_for(item.avatar) onerror=`this.onerror=null;this.src='` + url_for(theme.error_img.flink) + `'` alt=item.name )
|
||||
else
|
||||
.flink-item-icon
|
||||
img(src=url_for(item.avatar) onerror=`this.onerror=null;this.src='` + url_for(theme.error_img.flink) + `'` alt=item.name )
|
||||
span.flink-item-name= item.name
|
||||
span.flink-item-desc(title=item.descr)= item.descr
|
||||
.flink-item-name= item.name
|
||||
.flink-item-desc(title=item.descr)= item.descr
|
||||
!= page.content
|
||||
|
||||
|
||||
@@ -15,10 +15,7 @@ if is_post()
|
||||
.prev-post(class=hasPageNext)
|
||||
- var pagination_cover = prev.cover === false ? prev.randomcover : prev.cover
|
||||
a(href=url_for(prev.path))
|
||||
if theme.lazyload.enable
|
||||
img.prev-cover(data-lazy-src=url_for(pagination_cover) onerror=`onerror=null;src='${url_for(theme.error_img.post_page)}'` alt='cover of previous post')
|
||||
else
|
||||
img.prev-cover(src=url_for(pagination_cover) onerror=`onerror=null;src='${url_for(theme.error_img.post_page)}'` alt='cover of previous post')
|
||||
img.prev-cover(src=url_for(pagination_cover) onerror=`onerror=null;src='${url_for(theme.error_img.post_page)}'` alt='cover of previous post')
|
||||
.pagination-info
|
||||
.label=_p('pagination.prev')
|
||||
.prev_info=prev.title
|
||||
@@ -28,10 +25,7 @@ if is_post()
|
||||
- var pagination_cover = next.cover == false ? next.randomcover : next.cover
|
||||
.next-post(class=hasPagePrev)
|
||||
a(href=url_for(next.path))
|
||||
if theme.lazyload.enable
|
||||
img.next-cover(data-lazy-src=url_for(pagination_cover) onerror=`onerror=null;src='${url_for(theme.error_img.post_page)}'` alt='cover of next post')
|
||||
else
|
||||
img.next-cover(src=url_for(pagination_cover) onerror=`onerror=null;src='${url_for(theme.error_img.post_page)}'` alt='cover of next post')
|
||||
img.next-cover(src=url_for(pagination_cover) onerror=`onerror=null;src='${url_for(theme.error_img.post_page)}'` alt='cover of next post')
|
||||
.pagination-info
|
||||
.label=_p('pagination.next')
|
||||
.next_info=next.title
|
||||
|
||||
@@ -8,9 +8,6 @@
|
||||
- var clickTo = item.link ? item.link : item.img
|
||||
li.reward-item
|
||||
a(href=url_for(clickTo) target='_blank')
|
||||
if theme.lazyload.enable
|
||||
img.post-qr-code-img(data-lazy-src=url_for(item.img) alt=item.text)
|
||||
else
|
||||
img.post-qr-code-img(src=url_for(item.img) alt=item.text)
|
||||
img.post-qr-code-img(src=url_for(item.img) alt=item.text)
|
||||
.post-qr-code-desc=item.text
|
||||
|
||||
|
||||
@@ -1,11 +1,8 @@
|
||||
#sidebar
|
||||
#menu-mask
|
||||
#sidebar-menus
|
||||
.author-avatar
|
||||
if theme.lazyload.enable
|
||||
img.avatar-img(data-lazy-src=url_for(theme.avatar.img) onerror=`onerror=null;src='${theme.error_img.flink}'` alt="avatar")
|
||||
else
|
||||
img.avatar-img(src=url_for(theme.avatar.img) onerror=`onerror=null;src='${theme.error_img.flink}'` alt="avatar")
|
||||
.avatar-img.is-center
|
||||
img(src=url_for(theme.avatar.img) onerror=`onerror=null;src='${theme.error_img.flink}'` alt="avatar")
|
||||
.site-data
|
||||
if site.posts.length
|
||||
.data-item.is-center
|
||||
|
||||
@@ -3,10 +3,9 @@ script.
|
||||
function loadWaline () {
|
||||
function initWaline () {
|
||||
let initData = {
|
||||
el: '#waline-wrap',
|
||||
el: null,
|
||||
serverURL: '!{theme.waline.serverURL}',
|
||||
}
|
||||
|
||||
const waline = new Waline(initData)
|
||||
}
|
||||
|
||||
|
||||
@@ -57,3 +57,4 @@ if is_post() && !theme.comments.lazyload && theme.comments.count && theme.commen
|
||||
} else {
|
||||
DISQUSWIDGETS.getCount({reset: true});
|
||||
}
|
||||
|
||||
|
||||
@@ -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=v9.0')
|
||||
ele.setAttribute('src','https://connect.facebook.net/!{theme.facebook_comments.lang}/sdk.js#xfbml=1&version=v10.0')
|
||||
ele.setAttribute('async', 'true')
|
||||
ele.setAttribute('defer', 'true')
|
||||
ele.setAttribute('crossorigin', 'anonymous')
|
||||
|
||||
16
layout/includes/third-party/comments/waline.pug
vendored
16
layout/includes/third-party/comments/waline.pug
vendored
@@ -1,19 +1,17 @@
|
||||
- let emojiMaps = '""'
|
||||
if site.data.waline
|
||||
- emojiMaps = JSON.stringify(site.data.waline)
|
||||
- const { serverURL, avatar, avatarCDN, visitor, option } = theme.waline
|
||||
|
||||
script.
|
||||
function loadWaline () {
|
||||
function initWaline () {
|
||||
const waline = new Waline(Object.assign({
|
||||
el: '#waline-wrap',
|
||||
serverURL: '!{theme.waline.serverURL}',
|
||||
avatar: '#{theme.waline.avatar}',
|
||||
serverURL: '!{serverURL}',
|
||||
avatar: '#{avatar}',
|
||||
avatarCDN: '!{avatarCDN || "https://sdn.geekzu.org/avatar/"}',
|
||||
path: location.pathname,
|
||||
emojiCDN: '#{theme.waline.emojiCDN}',
|
||||
emojiMaps: !{emojiMaps},
|
||||
visitor: #{theme.waline.visitor}
|
||||
}, !{JSON.stringify(theme.waline.option)}))
|
||||
visitor: !{visitor},
|
||||
dark: 'html[data-theme="dark"]'
|
||||
}, !{JSON.stringify(option)}))
|
||||
}
|
||||
|
||||
if (typeof Waline === 'function') initWaline()
|
||||
|
||||
2
layout/includes/third-party/math/katex.pug
vendored
2
layout/includes/third-party/math/katex.pug
vendored
@@ -4,7 +4,7 @@ link(rel="stylesheet" type="text/css" href=theme.CDN.katex_copytex_css)
|
||||
script.
|
||||
(() => {
|
||||
document.querySelectorAll('#article-container span.katex-display').forEach(item => {
|
||||
btf.wrap(item, 'div', '', 'katex-wrap')
|
||||
btf.wrap(item, 'div', { class: 'katex-wrap'})
|
||||
})
|
||||
})()
|
||||
|
||||
25
layout/includes/third-party/math/mathjax.pug
vendored
25
layout/includes/third-party/math/mathjax.pug
vendored
@@ -1,21 +1,14 @@
|
||||
//- Mathjax 3
|
||||
//- http://docs.mathjax.org/en/latest/upgrading/v2.html#changes-in-the-mathjax-api
|
||||
//- https://github.com/mathjax/MathJax/issues/2209
|
||||
//- http://docs.mathjax.org/en/latest/options/input/tex.html#the-configuration-block
|
||||
//- http://docs.mathjax.org/en/latest/web/typeset.html#resetting-automatic-equation-numbering
|
||||
|
||||
script.
|
||||
if (!window.MathJax) {
|
||||
window.MathJax = {
|
||||
loader: {
|
||||
source: {
|
||||
'[tex]/amsCd': '[tex]/amscd'
|
||||
}
|
||||
},
|
||||
tex: {
|
||||
inlineMath: [ ['$','$'], ["\\(","\\)"]],
|
||||
tags: 'ams'
|
||||
},
|
||||
chtml: {
|
||||
scale: 1.2
|
||||
},
|
||||
options: {
|
||||
renderActions: {
|
||||
findScript: [10, doc => {
|
||||
@@ -29,13 +22,15 @@ script.
|
||||
doc.math.push(math)
|
||||
}
|
||||
}, ''],
|
||||
addClass: [200,() => {
|
||||
document.querySelectorAll('mjx-container:not([display=\'true\']').forEach( node => {
|
||||
insertScript: [200, () => {
|
||||
document.querySelectorAll('mjx-container:not\([display]\)').forEach(node => {
|
||||
const target = node.parentNode
|
||||
if (!target.classList.contains('has-jax')) {
|
||||
target.classList.add('mathjax-overflow')
|
||||
if (target.nodeName.toLowerCase() === 'li') {
|
||||
target.parentNode.classList.add('has-jax')
|
||||
} else {
|
||||
target.classList.add('has-jax')
|
||||
}
|
||||
})
|
||||
});
|
||||
}, '', false]
|
||||
}
|
||||
}
|
||||
|
||||
@@ -15,7 +15,7 @@ script.
|
||||
}
|
||||
|
||||
const getComment = () => {
|
||||
fetch('https://disqus.com/api/3.0/forums/listPosts.json?forum=!{theme.newest_comments.disqus.forum}&related=thread&limit=!{theme.newest_comments.limit}&api_key=!{theme.newest_comments.disqus.api_key}')
|
||||
fetch('https://disqus.com/api/3.0/forums/listPosts.json?forum=!{forum}&related=thread&limit=!{theme.newest_comments.limit}&api_key=!{apiKey}')
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
const disqusArray = data.response.map(item => {
|
||||
|
||||
@@ -38,7 +38,7 @@ script.
|
||||
}
|
||||
|
||||
const getComment = () => {
|
||||
fetch('https://api.github.com/repos/!{theme.newest_comments.github_issues.repo}/issues/comments?sort=updated&direction=desc&per_page=!{theme.newest_comments.limit}&page=1',{
|
||||
fetch('https://api.github.com/repos/!{userRepo}/issues/comments?sort=updated&direction=desc&per_page=!{theme.newest_comments.limit}&page=1',{
|
||||
"headers": {
|
||||
Accept: 'application/vnd.github.v3.html+json'
|
||||
}
|
||||
@@ -102,4 +102,8 @@ script.
|
||||
|
||||
newestCommentInit()
|
||||
document.addEventListener('pjax:complete', newestCommentInit)
|
||||
})
|
||||
})
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
@@ -1,12 +1,26 @@
|
||||
- let config = theme.newest_comments
|
||||
- let { use } = theme.comments
|
||||
|
||||
if config.valine
|
||||
include ./valine.pug
|
||||
else if config.waline
|
||||
include ./waline.pug
|
||||
else if config.github_issues.enable
|
||||
include ./github-issues.pug
|
||||
else if config.disqus.enable
|
||||
include ./disqus-comment.pug
|
||||
else if config.twikoo
|
||||
include ./twikoo-comment.pug
|
||||
if use
|
||||
- let forum,apiKey,userRepo
|
||||
case use[0]
|
||||
when 'Valine'
|
||||
include ./valine.pug
|
||||
when 'Waline'
|
||||
include ./waline.pug
|
||||
when 'Twikoo'
|
||||
include ./twikoo-comment.pug
|
||||
when 'Disqus'
|
||||
- forum = theme.disqus.shortname
|
||||
- apiKey = theme.disqus.apikey
|
||||
include ./disqus-comment.pug
|
||||
when 'Disqusjs'
|
||||
- forum = theme.disqusjs.shortname
|
||||
- apiKey = theme.disqusjs.apikey
|
||||
include ./disqus-comment.pug
|
||||
when 'Gitalk'
|
||||
- let { repo,owner } = theme.gitalk
|
||||
- userRepo = owner + '/' + repo
|
||||
include ./github-issues.pug
|
||||
when 'Utterances'
|
||||
- userRepo = theme.utterances.repo
|
||||
include ./github-issues.pug
|
||||
@@ -1,4 +1,4 @@
|
||||
- let default_avatar = theme.waline.avatar
|
||||
- let { avatar,avatarCDN } = theme.waline
|
||||
|
||||
script.
|
||||
window.addEventListener('load', () => {
|
||||
@@ -16,10 +16,10 @@ script.
|
||||
return content
|
||||
}
|
||||
|
||||
const getIcon = (avatar,mail) => {
|
||||
if (avatar) return avatar
|
||||
let defaultIcon = '!{ default_avatar ? `?d=${default_avatar}` : ''}'
|
||||
let iconUrl = `https://gravatar.loli.net/avatar/${mail + defaultIcon}`
|
||||
const getIcon = (ava,mail) => {
|
||||
if (ava) return ava
|
||||
let defaultIcon = '!{ avatar ? `?d=${avatar}` : ''}'
|
||||
let iconUrl = "!{avatarCDN ? avatarCDN : 'https://gravatar.loli.net/avatar/'}" + mail + defaultIcon
|
||||
return iconUrl
|
||||
}
|
||||
|
||||
@@ -53,11 +53,10 @@ script.
|
||||
const getComment = () => {
|
||||
const loadWaline = () => {
|
||||
Waline.Widget.RecentComments({
|
||||
el: '#card-newest-comments .aside-list',
|
||||
serverURL: '!{theme.waline.serverURL}',
|
||||
count: !{theme.newest_comments.limit}
|
||||
}).then(comments => {
|
||||
const walineArray = comments.map(function (e) {
|
||||
}).then(res => {
|
||||
const walineArray = res.comments.map(e => {
|
||||
return {
|
||||
'content': changeContent(e.comment),
|
||||
'avatar': getIcon(e.QQAvatar,e.mail),
|
||||
|
||||
44
layout/includes/third-party/pjax.pug
vendored
44
layout/includes/third-party/pjax.pug
vendored
@@ -26,6 +26,30 @@ script.
|
||||
scrollRestoration: false
|
||||
})
|
||||
|
||||
document.addEventListener('pjax:send', function () {
|
||||
|
||||
// removeEventListener scroll
|
||||
window.removeEventListener('scroll', window.tocScrollFn)
|
||||
window.removeEventListener('scroll', scrollCollect)
|
||||
|
||||
typeof preloader === 'object' && preloader.initLoading()
|
||||
|
||||
if (window.aplayers) {
|
||||
for (let i = 0; i < window.aplayers.length; i++) {
|
||||
if (!window.aplayers[i].options.fixed) {
|
||||
window.aplayers[i].destroy()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
typeof typed === 'object' && typed.destroy()
|
||||
|
||||
//reset readmode
|
||||
const $bodyClassList = document.body.classList
|
||||
$bodyClassList.contains('read-mode') && $bodyClassList.remove('read-mode')
|
||||
|
||||
})
|
||||
|
||||
document.addEventListener('pjax:complete', function () {
|
||||
window.refreshFn()
|
||||
|
||||
@@ -61,26 +85,6 @@ script.
|
||||
typeof preloader === 'object' && preloader.endLoading()
|
||||
})
|
||||
|
||||
|
||||
document.addEventListener('pjax:send', function () {
|
||||
typeof preloader === 'object' && preloader.initLoading()
|
||||
|
||||
if (window.aplayers) {
|
||||
for (let i = 0; i < window.aplayers.length; i++) {
|
||||
if (!window.aplayers[i].options.fixed) {
|
||||
window.aplayers[i].destroy()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
typeof typed === 'object' && typed.destroy()
|
||||
|
||||
//reset readmode
|
||||
const $bodyClassList = document.body.classList
|
||||
$bodyClassList.contains('read-mode') && $bodyClassList.remove('read-mode')
|
||||
|
||||
})
|
||||
|
||||
document.addEventListener('pjax:error', (e) => {
|
||||
if (e.request.status === 404) {
|
||||
pjax.loadUrl('/404.html')
|
||||
|
||||
@@ -1,10 +1,8 @@
|
||||
if theme.aside.card_author.enable
|
||||
.card-widget.card-info
|
||||
.card-info-avatar.is-center
|
||||
if theme.lazyload.enable
|
||||
img.avatar-img(data-lazy-src=url_for(theme.avatar.img) onerror=`this.onerror=null;this.src='` + url_for(theme.error_img.flink) + `'` alt="avatar")
|
||||
else
|
||||
img.avatar-img(src=url_for(theme.avatar.img) onerror=`this.onerror=null;this.src='` + url_for(theme.error_img.flink) + `'` alt="avatar")
|
||||
.is-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
|
||||
.author-info__description!= theme.aside.card_author.description || config.description
|
||||
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
if site.data.widget
|
||||
each item in site.data.widget
|
||||
if site.data.widget && site.data.widget.bottom
|
||||
each item in site.data.widget.bottom
|
||||
.card-widget(class=item.class_name id=item.id_name style=item.order ? `order: ${item.order}` : '')
|
||||
.item-headline
|
||||
i(class=item.icon)
|
||||
@@ -1,7 +1,7 @@
|
||||
if theme.newest_comments.enable
|
||||
.card-widget#card-newest-comments
|
||||
.item-headline
|
||||
i.fas.fa-bolt
|
||||
i.fas.fa-comment-dots
|
||||
span= _p('aside.card_newest_comments.headline')
|
||||
.aside-list
|
||||
span= _p('aside.card_newest_comments.loading_text')
|
||||
|
||||
@@ -14,10 +14,7 @@ if theme.aside.card_recent_post.enable
|
||||
.aside-list-item(class=no_cover)
|
||||
if post_cover && theme.cover.aside_enable
|
||||
a.thumbnail(href=url_for(link) title=title)
|
||||
if theme.lazyload.enable
|
||||
img(data-lazy-src=url_for(post_cover) onerror=`this.onerror=null;this.src='${url_for(theme.error_img.post_page)}'` alt=title)
|
||||
else
|
||||
img(src=url_for(post_cover) onerror=`this.onerror=null;this.src='${url_for(theme.error_img.post_page)}'` alt=title)
|
||||
img(src=url_for(post_cover) onerror=`this.onerror=null;this.src='${url_for(theme.error_img.post_page)}'` alt=title)
|
||||
.content
|
||||
a.title(href=url_for(link) title=title)= title
|
||||
if theme.aside.card_recent_post.sort === 'updated'
|
||||
|
||||
8
layout/includes/widget/card_top_self.pug
Normal file
8
layout/includes/widget/card_top_self.pug
Normal file
@@ -0,0 +1,8 @@
|
||||
if site.data.widget && site.data.widget.top
|
||||
each item in site.data.widget.top
|
||||
.card-widget(class=item.class_name id=item.id_name)
|
||||
.item-headline
|
||||
i(class=item.icon)
|
||||
span=item.name
|
||||
.item-content
|
||||
!=item.html
|
||||
@@ -7,6 +7,7 @@
|
||||
else
|
||||
!=partial('includes/widget/card_author', {}, {cache: true})
|
||||
!=partial('includes/widget/card_announcement', {}, {cache: true})
|
||||
!=partial('includes/widget/card_top_self', {}, {cache: true})
|
||||
.sticky_layout
|
||||
if showToc
|
||||
include ./card_post_toc.pug
|
||||
@@ -16,6 +17,8 @@
|
||||
//- page
|
||||
!=partial('includes/widget/card_author', {}, {cache: true})
|
||||
!=partial('includes/widget/card_announcement', {}, {cache: true})
|
||||
!=partial('includes/widget/card_top_self', {}, {cache: true})
|
||||
|
||||
.sticky_layout
|
||||
!=partial('includes/widget/card_recent_post', {}, {cache: true})
|
||||
!=partial('includes/widget/card_ad', {}, {cache: true})
|
||||
@@ -24,4 +27,4 @@
|
||||
!=partial('includes/widget/card_tags', {}, {cache: true})
|
||||
!=partial('includes/widget/card_archives', {}, {cache: true})
|
||||
!=partial('includes/widget/card_webinfo', {}, {cache: true})
|
||||
!=partial('includes/widget/card_self', {}, {cache: true})
|
||||
!=partial('includes/widget/card_bottom_self', {}, {cache: true})
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "hexo-theme-butterfly",
|
||||
"version": "3.7.1",
|
||||
"version": "3.8.3",
|
||||
"description": "A Simple and Card UI Design theme for Hexo",
|
||||
"main": "package.json",
|
||||
"scripts": {
|
||||
@@ -24,9 +24,9 @@
|
||||
},
|
||||
"dependencies": {
|
||||
"hexo-renderer-stylus": "^2.0.1",
|
||||
"hexo-renderer-pug": "^1.0.0"
|
||||
"hexo-renderer-pug": "^2.0.0"
|
||||
},
|
||||
"homepage": "https://butterfly.js.org/",
|
||||
"author": "Jerry <btf@immyw.com>",
|
||||
"author": "Jerry <i@immyw.com>",
|
||||
"license": "Apache-2.0"
|
||||
}
|
||||
|
||||
@@ -9,7 +9,10 @@ hexo.extend.generator.register('404', function (locals) {
|
||||
if (!hexo.theme.config.error_404.enable) return
|
||||
return {
|
||||
path: '404.html',
|
||||
data: locals.posts,
|
||||
layout: ['404']
|
||||
layout: ['page'],
|
||||
data: {
|
||||
type: '404',
|
||||
top_img: false
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
@@ -2,7 +2,7 @@ const logger = require('hexo-log')()
|
||||
|
||||
hexo.extend.filter.register('before_generate', () => {
|
||||
// Get first two digits of the Hexo version number
|
||||
var hexoVer = hexo.version.replace(/(^.*\..*)\..*/, '$1')
|
||||
const hexoVer = hexo.version.replace(/(^.*\..*)\..*/, '$1')
|
||||
|
||||
if (hexoVer < 5) {
|
||||
logger.error('Please update Hexo to V5.0.0 or higher!')
|
||||
|
||||
@@ -8,9 +8,22 @@
|
||||
|
||||
const urlFor = require('hexo-util').url_for.bind(hexo)
|
||||
|
||||
function lazyload (htmlContent) {
|
||||
const bg = hexo.theme.config.lazyload.placeholder ? urlFor(hexo.theme.config.lazyload.placeholder) : 'data:image/gif;base64,R0lGODdhAQABAPAAAMPDwwAAACwAAAAAAQABAAACAkQBADs='
|
||||
return htmlContent.replace(/(<img.*? src=)/ig, `$1 "${bg}" data-lazy-src=`)
|
||||
}
|
||||
|
||||
hexo.extend.filter.register('after_render:html', function (data) {
|
||||
const config = hexo.theme.config.lazyload
|
||||
if (!config.enable) return
|
||||
if (config.field !== 'site') return
|
||||
return lazyload.call(this, data)
|
||||
})
|
||||
|
||||
hexo.extend.filter.register('after_post_render', data => {
|
||||
if (!hexo.theme.config.lazyload.enable) return
|
||||
const bg = hexo.theme.config.lazyload.post ? urlFor(hexo.theme.config.lazyload.post) : 'data:image/gif;base64,R0lGODdhAQABAPAAAMPDwwAAACwAAAAAAQABAAACAkQBADs='
|
||||
data.content = data.content.replace(/(<img.*? src=)/ig, `$1 "${bg}" data-lazy-src=`)
|
||||
const config = hexo.theme.config.lazyload
|
||||
if (!config.enable) return
|
||||
if (config.field !== 'post') return
|
||||
data.content = lazyload.call(this, data.content)
|
||||
return data
|
||||
})
|
||||
|
||||
@@ -6,7 +6,7 @@
|
||||
'use strict'
|
||||
|
||||
hexo.extend.helper.register('inject_head_js', function () {
|
||||
const { darkmode, aside, change_font_size } = this.theme
|
||||
const { darkmode, aside, change_font_size, index_img, disable_top_img, pjax} = this.theme
|
||||
|
||||
const localStore = `
|
||||
win.saveToLocal = {
|
||||
@@ -141,5 +141,21 @@ hexo.extend.helper.register('inject_head_js', function () {
|
||||
`
|
||||
}
|
||||
|
||||
return `<script>(win=>{${localStore + getScript + darkmodeJs + asideStatus + changFontAside}})(window)</script>`
|
||||
let detectApple = ''
|
||||
if (!disable_top_img || index_img !== false) {
|
||||
detectApple = `
|
||||
const detectApple = () => {
|
||||
if (GLOBAL_CONFIG_SITE.isHome && /iPad|iPhone|iPod|Macintosh/.test(navigator.userAgent)){
|
||||
document.documentElement.classList.add('apple')
|
||||
}
|
||||
}
|
||||
detectApple()
|
||||
`
|
||||
|
||||
if (pjax.enable) {
|
||||
detectApple += 'document.addEventListener(\'pjax:complete\', detectApple)'
|
||||
}
|
||||
}
|
||||
|
||||
return `<script>(win=>{${localStore + getScript + darkmodeJs + asideStatus + changFontAside + detectApple}})(window)</script>`
|
||||
})
|
||||
|
||||
@@ -70,3 +70,22 @@ hexo.extend.helper.register('injectHtml', function (data) {
|
||||
}
|
||||
return result
|
||||
})
|
||||
|
||||
hexo.extend.helper.register('findArchivesTitle', function (menu) {
|
||||
const defaultTitle = this._p('page.archives')
|
||||
if (!menu) return defaultTitle
|
||||
|
||||
const loop = (m) => {
|
||||
for (const key in m) {
|
||||
if (typeof m[key] === 'object') {
|
||||
loop(m[key])
|
||||
}
|
||||
|
||||
if (/\/archives\//.test(m[key])) {
|
||||
return key
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return loop(menu) || defaultTitle
|
||||
})
|
||||
|
||||
@@ -41,7 +41,6 @@ hexo.extend.helper.register('related_posts', function (currentPost, allPosts) {
|
||||
const limitNum = config.related_post.limit || 6
|
||||
const dateType = config.related_post.date_type || 'created'
|
||||
const headlineLang = this._p('post.recommend')
|
||||
const lazySrc = config.lazyload.enable ? 'data-lazy-src' : 'src'
|
||||
|
||||
relatedPosts = relatedPosts.sort(compare('weight'))
|
||||
|
||||
@@ -67,9 +66,7 @@ hexo.extend.helper.register('related_posts', function (currentPost, allPosts) {
|
||||
relatedPosts[i].title +
|
||||
'">'
|
||||
result +=
|
||||
'<img class="cover" ' +
|
||||
lazySrc +
|
||||
'="' +
|
||||
'<img class="cover" src="' +
|
||||
this.url_for(cover) +
|
||||
'" alt="cover">'
|
||||
if (dateType === 'created') {
|
||||
|
||||
@@ -22,7 +22,7 @@ function btn (args) {
|
||||
option = option.trim()
|
||||
|
||||
return `<a class="btn-beautify button--animated ${option}" href="${urlFor(url)}"
|
||||
title="${text}">${icon.length > 0 ? `<i class="${icon} fa-fw"></i>` : ''}<span>${text}</span></a>`
|
||||
title="${text}">${icon.length ? `<i class="${icon}"></i>` : ''}${text.length ? `<span>${text}</span>` : ''}</a>`
|
||||
}
|
||||
|
||||
hexo.extend.tag.register('btn', btn, { ends: false })
|
||||
|
||||
16
scripts/tag/label.js
Normal file
16
scripts/tag/label.js
Normal file
@@ -0,0 +1,16 @@
|
||||
/**
|
||||
* Butterfly
|
||||
* label
|
||||
* {% label text color %}
|
||||
*/
|
||||
|
||||
'use strict'
|
||||
|
||||
function addLabel (args, content) {
|
||||
const text = args[0]
|
||||
const className = args[1] || 'default'
|
||||
|
||||
return `<mark class="hl-label ${className}">${text}</mark> `
|
||||
}
|
||||
|
||||
hexo.extend.tag.register('label', addLabel, { ends: false })
|
||||
@@ -19,7 +19,7 @@
|
||||
--btn-hover-color: $button-hover-color
|
||||
--btn-color: $button-color
|
||||
--btn-bg: $button-bg
|
||||
--text-bg-hover: $text-bg-hover
|
||||
--text-bg-hover: rgba($text-bg-hover, .7)
|
||||
--light-grey: $light-grey
|
||||
--white: $white
|
||||
--text-highlight-color: $text-highlight-color
|
||||
@@ -206,6 +206,15 @@ img
|
||||
&:not([src])
|
||||
opacity: 0
|
||||
|
||||
// lazyload blur
|
||||
if hexo-config('lazyload.enable') && hexo-config('lazyload.blur') && !hexo-config('lazyload.placeholder')
|
||||
img
|
||||
&[data-lazy-src]:not(.loaded)
|
||||
filter: blur(10px) brightness(1)
|
||||
|
||||
&[data-lazy-src].error
|
||||
filter: none
|
||||
|
||||
.img-alt
|
||||
margin: -.5rem 0 .5rem
|
||||
color: #858585
|
||||
|
||||
@@ -110,7 +110,7 @@ blockquote
|
||||
color: var(--hltools-color)
|
||||
font-size: $code-font-size
|
||||
|
||||
&.closed + table
|
||||
&.closed ~ *
|
||||
display: none
|
||||
|
||||
.expand
|
||||
|
||||
@@ -1,82 +0,0 @@
|
||||
if hexo-config('error_404.enable')
|
||||
#error-wrap
|
||||
position: absolute
|
||||
top: 50%
|
||||
right: 0
|
||||
left: 0
|
||||
margin: 0 auto
|
||||
padding: 0 1rem
|
||||
max-width: 1000px
|
||||
transform: translate(0, -50%)
|
||||
|
||||
.error-content
|
||||
display: flex
|
||||
flex-direction: row
|
||||
justify-content: center
|
||||
align-items: center
|
||||
margin: 0 1rem
|
||||
height: 18rem
|
||||
border-radius: 8px
|
||||
background: var(--card-bg)
|
||||
box-shadow: var(--card-box-shadow)
|
||||
transition: all .3s
|
||||
|
||||
&:hover
|
||||
box-shadow: var(--card-hover-box-shadow)
|
||||
|
||||
+maxWidth768()
|
||||
flex-direction: column
|
||||
margin: 0
|
||||
height: 25rem
|
||||
|
||||
.error-img
|
||||
flex: 1
|
||||
height: 100%
|
||||
border-top-left-radius: 8px
|
||||
border-bottom-left-radius: 8px
|
||||
background-color: $theme-color
|
||||
background-position: center
|
||||
background-size: cover
|
||||
|
||||
+maxWidth768()
|
||||
flex: 1
|
||||
width: 100%
|
||||
border-top-right-radius: 8px
|
||||
border-bottom-left-radius: 0
|
||||
|
||||
.error-info
|
||||
flex: 1
|
||||
padding: .5rem
|
||||
text-align: center
|
||||
font-size: 14px
|
||||
|
||||
if $site-name-font
|
||||
font-family: $site-name-font
|
||||
|
||||
+maxWidth768()
|
||||
flex: 1.1
|
||||
width: 100%
|
||||
|
||||
.error_title
|
||||
margin-top: -4rem
|
||||
font-size: 9em
|
||||
|
||||
+maxWidth768()
|
||||
margin-top: -3rem
|
||||
|
||||
.error_subtitle
|
||||
@extend .limit-more-line
|
||||
margin-top: -3.5rem
|
||||
word-break: break-word
|
||||
font-size: 1.6em
|
||||
-webkit-line-clamp: 2
|
||||
|
||||
a
|
||||
display: inline-block
|
||||
margin-top: .5rem
|
||||
padding: .3rem 1.5rem
|
||||
background: var(--btn-bg)
|
||||
color: var(--btn-color)
|
||||
|
||||
i
|
||||
padding-right: .3rem
|
||||
@@ -35,15 +35,6 @@
|
||||
display: none
|
||||
|
||||
.card-info
|
||||
img
|
||||
width: 110px
|
||||
height: 110px
|
||||
border-radius: 70px
|
||||
transition: all .5s
|
||||
|
||||
&:hover
|
||||
transform: rotate(360deg)
|
||||
|
||||
.author-info
|
||||
&__name
|
||||
font-weight: 500
|
||||
@@ -103,7 +94,7 @@
|
||||
font-size: 1.2em
|
||||
|
||||
span
|
||||
margin-left: .5rem
|
||||
margin-left: .3rem
|
||||
|
||||
.sticky_layout
|
||||
+minWidth900()
|
||||
@@ -331,6 +322,21 @@
|
||||
&:hover
|
||||
animation: more-btn-move 1s infinite
|
||||
|
||||
.avatar-img
|
||||
overflow: hidden
|
||||
margin: 0 auto
|
||||
width: 110px
|
||||
height: 110px
|
||||
border-radius: 70px
|
||||
|
||||
img
|
||||
height: 100%
|
||||
transition: all .5s
|
||||
object-fit: cover
|
||||
|
||||
&:hover
|
||||
transform: rotate(360deg)
|
||||
|
||||
@keyframes more-btn-move
|
||||
0%,
|
||||
100%
|
||||
|
||||
@@ -157,12 +157,9 @@
|
||||
top: 70px
|
||||
transition: top .5s
|
||||
|
||||
// css hack
|
||||
// all browser in ios and safari in all apple device
|
||||
_::-webkit-full-page-media,
|
||||
_:future,
|
||||
:root #page-header.full_page
|
||||
background-attachment: scroll !important
|
||||
.apple
|
||||
#page-header.full_page
|
||||
background-attachment: scroll !important
|
||||
|
||||
#page
|
||||
h1.page-title
|
||||
|
||||
@@ -185,6 +185,9 @@ no-beautify()
|
||||
else
|
||||
no-beautify()
|
||||
|
||||
> :last-child
|
||||
margin-bottom: 0 !important
|
||||
|
||||
#post
|
||||
.tag_share
|
||||
.post-meta
|
||||
|
||||
@@ -22,22 +22,12 @@
|
||||
&.open
|
||||
transform: translate3d(-100%, 0, 0)
|
||||
|
||||
& > .author-avatar
|
||||
padding: 1.3rem 1.5rem 0
|
||||
text-align: center
|
||||
|
||||
img
|
||||
width: 110px
|
||||
height: 110px
|
||||
border-radius: 70px
|
||||
transition: all .5s
|
||||
|
||||
&:hover
|
||||
transform: rotate(360deg)
|
||||
& > .avatar-img
|
||||
margin: 1rem auto
|
||||
|
||||
.site-data
|
||||
display: table
|
||||
padding: .6rem .5rem 0
|
||||
padding: 0 .5rem
|
||||
width: 100%
|
||||
table-layout: fixed
|
||||
|
||||
@@ -65,25 +55,21 @@
|
||||
@extend .limit-one-line
|
||||
position: relative
|
||||
display: block
|
||||
padding: .3rem 1.5rem
|
||||
padding: .3rem 1.5rem .3rem 1.1rem
|
||||
color: var(--font-color)
|
||||
font-size: 1.15em
|
||||
cursor: pointer
|
||||
|
||||
&:hover
|
||||
background: var(--text-bg-hover)
|
||||
|
||||
i:first-child
|
||||
width: 25%
|
||||
width: 15%
|
||||
text-align: left
|
||||
|
||||
span
|
||||
width: 75%
|
||||
|
||||
&:hover
|
||||
color: $light-blue
|
||||
|
||||
.expand
|
||||
position: absolute
|
||||
top: .78em
|
||||
right: .4rem
|
||||
right: .9rem
|
||||
transition: transform .3s
|
||||
|
||||
&.hide
|
||||
|
||||
@@ -1,5 +1,4 @@
|
||||
#vcomment,
|
||||
#waline
|
||||
#vcomment
|
||||
font-size: 1.1em
|
||||
|
||||
.vbtn
|
||||
@@ -21,6 +20,18 @@
|
||||
&:after
|
||||
z-index: 22
|
||||
|
||||
#waline-wrap
|
||||
--waline-font-size: 1.1em
|
||||
--waline-theme-color: $button-bg
|
||||
--waline-active-color: $button-hover-color
|
||||
--waline-avatar-size: 2.75rem
|
||||
|
||||
.vuser
|
||||
transition: all .5s
|
||||
|
||||
&:hover
|
||||
transform: rotate(360deg)
|
||||
|
||||
if hexo-config('valine.bg')
|
||||
#vcomment
|
||||
textarea
|
||||
@@ -79,15 +90,11 @@ if hexo-config('waline.bg')
|
||||
display: none
|
||||
|
||||
// mathjax
|
||||
.mathjax-overflow
|
||||
mjx-container[display],
|
||||
.has-jax
|
||||
overflow-x: auto
|
||||
overflow-y: hidden
|
||||
|
||||
mjx-container[jax='CHTML'][display='true']
|
||||
overflow-x: auto
|
||||
overflow-y: hidden
|
||||
padding-bottom: .3rem
|
||||
|
||||
.aplayer
|
||||
color: $font-black
|
||||
|
||||
|
||||
@@ -91,14 +91,20 @@ if hexo-config('darkmode.enable') || hexo-config('display_mode') == 'dark'
|
||||
.hide-button,
|
||||
.btn-beautify,
|
||||
.mermaid,
|
||||
.hl-label,
|
||||
.post-outdate-notice,
|
||||
.error-img,
|
||||
#article-container iframe,
|
||||
img,
|
||||
.gist,
|
||||
.ads-wrap
|
||||
filter: brightness(.8)
|
||||
|
||||
img
|
||||
if hexo-config('lazyload.enable') && hexo-config('lazyload.blur') && !hexo-config('lazyload.placeholder')
|
||||
filter: blur(0) brightness(.8)
|
||||
else
|
||||
filter: brightness(.8)
|
||||
|
||||
#aside-content .aside-list > .aside-list-item:not(:last-child)
|
||||
border-bottom: 1px dashed alpha(#FFFFFF, .1)
|
||||
|
||||
|
||||
@@ -173,24 +173,15 @@ if hexo-config('readmode')
|
||||
border: 1px solid var(--gray) !important
|
||||
|
||||
.hide-button,
|
||||
.btn-beautify
|
||||
.btn-beautify,
|
||||
.hl-label
|
||||
border: 1px solid var(--gray) !important
|
||||
background: var(--readmode-light-color) !important
|
||||
color: var(--font-color) !important
|
||||
|
||||
.btn-beautify
|
||||
border: 1px solid var(--gray) !important
|
||||
|
||||
.button--animated:before
|
||||
background: var(--readmode-light-color) !important
|
||||
|
||||
.hide-inline,
|
||||
.hide-block
|
||||
& >.hide-button
|
||||
border: 1px solid var(--gray)
|
||||
|
||||
& > .button--animated:before
|
||||
background: var(--readmode-light-color)
|
||||
|
||||
.note
|
||||
border: 2px solid var(--gray)
|
||||
border-left-color: var(--gray) !important
|
||||
|
||||
86
source/css/_page/404.styl
Normal file
86
source/css/_page/404.styl
Normal file
@@ -0,0 +1,86 @@
|
||||
if hexo-config('error_404.enable')
|
||||
.error404
|
||||
#error-wrap
|
||||
position: absolute
|
||||
top: 50%
|
||||
right: 0
|
||||
left: 0
|
||||
margin: 0 auto
|
||||
padding: 0 1rem
|
||||
max-width: 1000px
|
||||
transform: translate(0, -50%)
|
||||
|
||||
.error-content
|
||||
display: flex
|
||||
flex-direction: row
|
||||
justify-content: center
|
||||
align-items: center
|
||||
margin: 0 1rem
|
||||
height: 18rem
|
||||
border-radius: 8px
|
||||
background: var(--card-bg)
|
||||
box-shadow: var(--card-box-shadow)
|
||||
transition: all .3s
|
||||
|
||||
&:hover
|
||||
box-shadow: var(--card-hover-box-shadow)
|
||||
|
||||
+maxWidth768()
|
||||
flex-direction: column
|
||||
margin: 0
|
||||
height: 25rem
|
||||
|
||||
.error-img
|
||||
flex: 1
|
||||
height: 100%
|
||||
border-top-left-radius: 8px
|
||||
border-bottom-left-radius: 8px
|
||||
background-color: $theme-color
|
||||
background-position: center
|
||||
background-size: cover
|
||||
|
||||
+maxWidth768()
|
||||
flex: 1
|
||||
width: 100%
|
||||
border-top-right-radius: 8px
|
||||
border-bottom-left-radius: 0
|
||||
|
||||
.error-info
|
||||
flex: 1
|
||||
padding: .5rem
|
||||
text-align: center
|
||||
font-size: 14px
|
||||
|
||||
if $site-name-font
|
||||
font-family: $site-name-font
|
||||
|
||||
+maxWidth768()
|
||||
flex: 1.1
|
||||
width: 100%
|
||||
|
||||
.error_title
|
||||
margin-top: -4rem
|
||||
font-size: 9em
|
||||
|
||||
+maxWidth768()
|
||||
margin-top: -3rem
|
||||
|
||||
.error_subtitle
|
||||
@extend .limit-more-line
|
||||
margin-top: -3.5rem
|
||||
word-break: break-word
|
||||
font-size: 1.6em
|
||||
-webkit-line-clamp: 2
|
||||
|
||||
a
|
||||
display: inline-block
|
||||
margin-top: .5rem
|
||||
padding: .3rem 1.5rem
|
||||
background: var(--btn-bg)
|
||||
color: var(--btn-color)
|
||||
|
||||
i
|
||||
padding-right: .3rem
|
||||
|
||||
& + #rightside
|
||||
display: none
|
||||
@@ -1,8 +1,15 @@
|
||||
#body-wrap
|
||||
display: flex
|
||||
flex-direction: column
|
||||
min-height: 100vh
|
||||
|
||||
.layout
|
||||
display: flex
|
||||
flex: 1 auto
|
||||
margin: 0 auto
|
||||
padding: 2rem 15px
|
||||
max-width: 1200px
|
||||
width: 100%
|
||||
|
||||
+maxWidth900()
|
||||
flex-direction: column
|
||||
|
||||
@@ -50,20 +50,24 @@
|
||||
color: var(--font-color)
|
||||
text-decoration: none
|
||||
|
||||
img
|
||||
.flink-item-icon
|
||||
float: left
|
||||
overflow: hidden
|
||||
margin: 15px 10px
|
||||
width: 60px
|
||||
height: 60px
|
||||
border-radius: 35px
|
||||
transition: all .3s
|
||||
|
||||
img
|
||||
width: 100%
|
||||
height: 100%
|
||||
transition: all .3s
|
||||
|
||||
.img-alt
|
||||
display: none
|
||||
|
||||
.flink-item-name
|
||||
@extend .limit-one-line
|
||||
display: block
|
||||
padding: 16px 10px 0 0
|
||||
height: 40px
|
||||
font-weight: bold
|
||||
@@ -71,7 +75,6 @@
|
||||
|
||||
.flink-item-desc
|
||||
@extend .limit-one-line
|
||||
display: block
|
||||
padding: 16px 10px 16px 0
|
||||
height: 50px
|
||||
font-size: .93em
|
||||
|
||||
@@ -1,7 +1,5 @@
|
||||
#algolia-search
|
||||
.search-dialog
|
||||
animation: titlescale .5s
|
||||
|
||||
.ais-search-box
|
||||
margin: 0 auto
|
||||
max-width: 100%
|
||||
|
||||
@@ -7,7 +7,9 @@
|
||||
margin-left: -15rem
|
||||
padding: 1rem
|
||||
width: 30rem
|
||||
border-radius: 8px
|
||||
background: var(--search-bg)
|
||||
animation: titlescale .5s
|
||||
|
||||
+maxWidth768()
|
||||
top: 0
|
||||
@@ -15,6 +17,7 @@
|
||||
margin: 0
|
||||
width: 100%
|
||||
height: 100%
|
||||
border-radius: 0
|
||||
|
||||
hr
|
||||
margin: 1rem auto
|
||||
|
||||
@@ -1,7 +1,5 @@
|
||||
#local-search
|
||||
.search-dialog
|
||||
animation: titlescale .5s
|
||||
|
||||
.local-search-box
|
||||
margin: 0 auto
|
||||
max-width: 100%
|
||||
|
||||
@@ -11,6 +11,9 @@
|
||||
color: $btn-color
|
||||
line-height: 2
|
||||
|
||||
i + span
|
||||
margin-left: .3rem
|
||||
|
||||
&:not(.block) + .btn-beautify:not(.block)
|
||||
margin: 0 .2rem 1rem
|
||||
|
||||
|
||||
11
source/css/_tags/label.styl
Normal file
11
source/css/_tags/label.styl
Normal file
@@ -0,0 +1,11 @@
|
||||
.hl-label
|
||||
padding: 2px 4px
|
||||
border-radius: 3px
|
||||
color: $btn-color
|
||||
|
||||
&.default
|
||||
background-color: $btn-default-color
|
||||
|
||||
for $type in $tagsP-types
|
||||
&.{$type}
|
||||
background-color: lookup('$tagsP-' + $type + '-color')
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 45 KiB |
@@ -194,7 +194,7 @@ document.addEventListener('DOMContentLoaded', function () {
|
||||
$figureHighlight.forEach(function (item) {
|
||||
const langName = item.getAttribute('data-language') ? item.getAttribute('data-language') : 'Code'
|
||||
const highlightLangEle = `<div class="code-lang">${langName}</div>`
|
||||
btf.wrap(item, 'figure', '', 'highlight')
|
||||
btf.wrap(item, 'figure', { class: 'highlight' })
|
||||
createEle(highlightLangEle, item)
|
||||
})
|
||||
} else {
|
||||
@@ -208,7 +208,7 @@ document.addEventListener('DOMContentLoaded', function () {
|
||||
} else {
|
||||
if (isPrismjs) {
|
||||
$figureHighlight.forEach(function (item) {
|
||||
btf.wrap(item, 'figure', '', 'highlight')
|
||||
btf.wrap(item, 'figure', { class: 'highlight' })
|
||||
createEle('', item)
|
||||
})
|
||||
} else {
|
||||
@@ -294,7 +294,7 @@ document.addEventListener('DOMContentLoaded', function () {
|
||||
}
|
||||
|
||||
const addMediumZoom = () => {
|
||||
const zoom = mediumZoom(document.querySelectorAll('#article-container :not(a)>img'))
|
||||
const zoom = mediumZoom(document.querySelectorAll('#article-container :not(a):not(.flink-item-icon) > img'))
|
||||
zoom.on('open', e => {
|
||||
const photoBg = document.documentElement.getAttribute('data-theme') === 'dark' ? '#121212' : '#fff'
|
||||
zoom.update({
|
||||
@@ -305,7 +305,7 @@ document.addEventListener('DOMContentLoaded', function () {
|
||||
|
||||
const jqLoadAndRun = () => {
|
||||
const $fancyboxEle = GLOBAL_CONFIG.lightbox === 'fancybox'
|
||||
? document.querySelectorAll('#article-container :not(a):not(.gallery-group) > img, #article-container > img')
|
||||
? document.querySelectorAll('#article-container :not(a):not(.gallery-group):not(.flink-item-icon) > img, #article-container > img')
|
||||
: []
|
||||
const fbLengthNoZero = $fancyboxEle.length > 0
|
||||
const $jgEle = document.querySelectorAll('#article-container .justified-gallery')
|
||||
@@ -332,50 +332,55 @@ document.addEventListener('DOMContentLoaded', function () {
|
||||
return
|
||||
}
|
||||
|
||||
let initTop = 0
|
||||
let isChatShow = true
|
||||
const $header = document.getElementById('page-header')
|
||||
const isChatBtnHide = typeof chatBtnHide === 'function'
|
||||
const isChatBtnShow = typeof chatBtnShow === 'function'
|
||||
window.addEventListener('scroll', btf.throttle(function (e) {
|
||||
const currentTop = window.scrollY || document.documentElement.scrollTop
|
||||
const isDown = scrollDirection(currentTop)
|
||||
if (currentTop > 56) {
|
||||
if (isDown) {
|
||||
if ($header.classList.contains('nav-visible')) $header.classList.remove('nav-visible')
|
||||
if (isChatBtnShow && isChatShow === true) {
|
||||
chatBtnHide()
|
||||
isChatShow = false
|
||||
}
|
||||
} else {
|
||||
if (!$header.classList.contains('nav-visible')) $header.classList.add('nav-visible')
|
||||
if (isChatBtnHide && isChatShow === false) {
|
||||
chatBtnShow()
|
||||
isChatShow = true
|
||||
}
|
||||
}
|
||||
$header.classList.add('nav-fixed')
|
||||
if (window.getComputedStyle($rightside).getPropertyValue('opacity') === '0') {
|
||||
$rightside.style.cssText = 'opacity: 1; transform: translateX(-38px)'
|
||||
}
|
||||
} else {
|
||||
if (currentTop === 0) {
|
||||
$header.classList.remove('nav-fixed', 'nav-visible')
|
||||
}
|
||||
$rightside.style.cssText = "opacity: ''; transform: ''"
|
||||
}
|
||||
|
||||
if (document.body.scrollHeight <= innerHeight) {
|
||||
$rightside.style.cssText = 'opacity: 1; transform: translateX(-38px)'
|
||||
}
|
||||
}, 200))
|
||||
|
||||
// find the scroll direction
|
||||
function scrollDirection (currentTop) {
|
||||
const result = currentTop > initTop // true is down & false is up
|
||||
initTop = currentTop
|
||||
return result
|
||||
}
|
||||
|
||||
let initTop = 0
|
||||
let isChatShow = true
|
||||
const $header = document.getElementById('page-header')
|
||||
const isChatBtnHide = typeof chatBtnHide === 'function'
|
||||
const isChatBtnShow = typeof chatBtnShow === 'function'
|
||||
|
||||
window.scrollCollect = () => {
|
||||
return btf.throttle(function (e) {
|
||||
const currentTop = window.scrollY || document.documentElement.scrollTop
|
||||
const isDown = scrollDirection(currentTop)
|
||||
if (currentTop > 56) {
|
||||
if (isDown) {
|
||||
if ($header.classList.contains('nav-visible')) $header.classList.remove('nav-visible')
|
||||
if (isChatBtnShow && isChatShow === true) {
|
||||
chatBtnHide()
|
||||
isChatShow = false
|
||||
}
|
||||
} else {
|
||||
if (!$header.classList.contains('nav-visible')) $header.classList.add('nav-visible')
|
||||
if (isChatBtnHide && isChatShow === false) {
|
||||
chatBtnShow()
|
||||
isChatShow = true
|
||||
}
|
||||
}
|
||||
$header.classList.add('nav-fixed')
|
||||
if (window.getComputedStyle($rightside).getPropertyValue('opacity') === '0') {
|
||||
$rightside.style.cssText = 'opacity: 1; transform: translateX(-38px)'
|
||||
}
|
||||
} else {
|
||||
if (currentTop === 0) {
|
||||
$header.classList.remove('nav-fixed', 'nav-visible')
|
||||
}
|
||||
$rightside.style.cssText = "opacity: ''; transform: ''"
|
||||
}
|
||||
|
||||
if (document.body.scrollHeight <= innerHeight) {
|
||||
$rightside.style.cssText = 'opacity: 1; transform: translateX(-38px)'
|
||||
}
|
||||
}, 200)()
|
||||
}
|
||||
|
||||
window.addEventListener('scroll', scrollCollect)
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -388,11 +393,14 @@ document.addEventListener('DOMContentLoaded', function () {
|
||||
const $article = document.getElementById('article-container')
|
||||
|
||||
// main of scroll
|
||||
window.addEventListener('scroll', btf.throttle(function (e) {
|
||||
const currentTop = window.scrollY || document.documentElement.scrollTop
|
||||
scrollPercent(currentTop)
|
||||
findHeadPosition(currentTop)
|
||||
}, 100))
|
||||
window.tocScrollFn = function () {
|
||||
return btf.throttle(function () {
|
||||
const currentTop = window.scrollY || document.documentElement.scrollTop
|
||||
scrollPercent(currentTop)
|
||||
findHeadPosition(currentTop)
|
||||
}, 100)()
|
||||
}
|
||||
window.addEventListener('scroll', tocScrollFn)
|
||||
|
||||
const scrollPercent = function (currentTop) {
|
||||
const docHeight = $article.clientHeight
|
||||
@@ -410,7 +418,11 @@ document.addEventListener('DOMContentLoaded', function () {
|
||||
const updateAnchor = function (anchor) {
|
||||
if (window.history.replaceState && anchor !== window.location.hash) {
|
||||
if (!anchor) anchor = location.pathname
|
||||
window.history.replaceState({}, '', anchor)
|
||||
const title = GLOBAL_CONFIG_SITE.title
|
||||
window.history.replaceState({
|
||||
url: location.href,
|
||||
title: title
|
||||
}, title, anchor)
|
||||
}
|
||||
}
|
||||
|
||||
@@ -680,7 +692,7 @@ document.addEventListener('DOMContentLoaded', function () {
|
||||
const $table = document.querySelectorAll('#article-container :not(.highlight) > table, #article-container > table')
|
||||
if ($table.length) {
|
||||
$table.forEach(item => {
|
||||
btf.wrap(item, 'div', '', 'table-wrap')
|
||||
btf.wrap(item, 'div', { class: 'table-wrap' })
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
@@ -207,18 +207,18 @@ const btf = {
|
||||
*
|
||||
* @param {*} selector
|
||||
* @param {*} eleType the type of create element
|
||||
* @param {*} id id
|
||||
* @param {*} cn class name
|
||||
* @param {*} options object key: value
|
||||
*/
|
||||
wrap: function (selector, eleType, id = '', cn = '') {
|
||||
wrap: (selector, eleType, options) => {
|
||||
const creatEle = document.createElement(eleType)
|
||||
if (id) creatEle.id = id
|
||||
if (cn) creatEle.className = cn
|
||||
for (const [key, value] of Object.entries(options)) {
|
||||
creatEle.setAttribute(key, value)
|
||||
}
|
||||
selector.parentNode.insertBefore(creatEle, selector)
|
||||
creatEle.appendChild(selector)
|
||||
},
|
||||
|
||||
unwrap: function (el) {
|
||||
unwrap: el => {
|
||||
const elParentNode = el.parentNode
|
||||
if (elParentNode !== document.body) {
|
||||
elParentNode.parentNode.insertBefore(el, elParentNode)
|
||||
@@ -226,7 +226,7 @@ const btf = {
|
||||
}
|
||||
},
|
||||
|
||||
isJqueryLoad: (fn) => {
|
||||
isJqueryLoad: fn => {
|
||||
if (typeof jQuery === 'undefined') {
|
||||
getScript(GLOBAL_CONFIG.source.jQuery).then(fn)
|
||||
} else {
|
||||
@@ -234,9 +234,9 @@ const btf = {
|
||||
}
|
||||
},
|
||||
|
||||
isHidden: (ele) => ele.offsetHeight === 0 && ele.offsetWidth === 0,
|
||||
isHidden: ele => ele.offsetHeight === 0 && ele.offsetWidth === 0,
|
||||
|
||||
getEleTop: (ele) => {
|
||||
getEleTop: ele => {
|
||||
let actualTop = ele.offsetTop
|
||||
let current = ele.offsetParent
|
||||
|
||||
|
||||
Reference in New Issue
Block a user