feat: 可設置首頁文章不顯示內容/description

feat: 主頁文章時間和文章頁文章時間可以配置顯示日期還是相對時間
feat: top_img 可配置 [留空(默認色)/顏色/漸變色/圖片鏈接/ false(不顯示top_img)]
feat: footer可配置背景 [留空/false(默認色)/顏色/漸變色/圖片鏈接/true(跟top_img一樣)]
improvement: preloader 在 pjax 下 每個頁面都會加載
improvement: 修改判斷,避免用户設置2個lightbox 而導致報錯(只能設置一個)
improvement: 精確時間顯示 (剛剛/幾分鐘前/幾小時前/幾天前/幾個月前)
improvement: 刪除不必要的語言文件和css
chore: update hexo-renderer-stylus to 2.0.1
pull/353/head
Jerry 4 years ago
parent 8603db0545
commit 25b0c733dc

@ -144,11 +144,13 @@ error_404:
post_meta:
page: # Home Page
date_type: created # created or updated or both 主頁文章日期是創建日或者更新日或都顯示
date_format: date # date/relative 顯示日期還是相對日期
categories: true # true or false 主頁是否顯示分類
tags: false # true or false 主頁是否顯示標籤
label: true # true or false 顯示描述性文字
post:
date_type: both # created or updated or both 文章頁日期是創建日或者更新日或都顯示
date_format: date # date/relative 顯示日期還是相對日期
categories: true # true or false 文章頁是否顯示分類
tags: true # true or false 文章頁是否顯示標籤
label: true # true or false 顯示描述性文字
@ -164,6 +166,7 @@ wordcount:
# 1: description
# 2: both (if the description exists, it will show description, or show the auto_excerpt)
# 3: auto_excerpt (default)
# false: do not show the article introduction
index_post_content:
method: 3
length: 500 # if you set method to 2 or 3, the length need to config

@ -81,19 +81,17 @@ aside:
day: days ago
date_suffix:
one_hour: Just
hours: hours ago
just: Just
min: minutes ago
hour: hours ago
day: days ago
month: months ago
donate: Donate
share: Share
bookmark:
title: Bookmark
rightside:
readmode_title: Read Mode
font_plus_title: Increase Font Size
font_minus_title: Decrease Font Size
translate_title: Switch Between Traditional Chinese And Simplified Chinese
night_mode_title: Switch Between Light And Dark Mode
back_to_top: Back To Top
@ -108,9 +106,6 @@ copy_copyright:
info: Copyright is owned by the author. For commercial reprints, please contact the author for authorization. For non-commercial reprints, please indicate the source.
Snackbar:
bookmark:
message_prev: Press
message_next: to bookmark this page
chs_to_cht: Traditional Chinese Activated Manually
cht_to_chs: Simplified Chinese Activated Manually
day_to_night: Dark Mode Activated Manually

@ -81,19 +81,17 @@ aside:
day: days ago
date_suffix:
one_hour: Just
hours: hours ago
just: Just
min: minutes ago
hour: hours ago
day: days ago
month: months ago
donate: Donate
share: Share
bookmark:
title: Bookmark
rightside:
readmode_title: Read Mode
font_plus_title: Increase Font Size
font_minus_title: Decrease Font Size
translate_title: Switch Between Traditional Chinese And Simplified Chinese
night_mode_title: Switch Between Light And Dark Mode
back_to_top: Back To Top
@ -108,9 +106,6 @@ copy_copyright:
info: Copyright is owned by the author. For commercial reprints, please contact the author for authorization. For non-commercial reprints, please indicate the source.
Snackbar:
bookmark:
message_prev: Press
message_next: to bookmark this page
chs_to_cht: Traditional Chinese Activated Manually
cht_to_chs: Simplified Chinese Activated Manually
day_to_night: Dark Mode Activated Manually

@ -83,19 +83,17 @@ aside:
day: 天前
date_suffix:
one_hour: 刚刚
hours: 小时前
just: 刚刚
min: 分钟前
hour: 小时前
day: 天前
month: 个月前
donate: 打赏
share: 分享
bookmark:
title: 添加书签
rightside:
readmode_title: 阅读模式
font_plus_title: 放大字体
font_minus_title: 缩小字体
translate_title: 简繁转换
night_mode_title: 浅色和深色模式转换
back_to_top: 回到顶部
@ -110,9 +108,6 @@ copy_copyright:
info: 著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。
Snackbar:
bookmark:
message_prev:
message_next: 键将本页加入书签
chs_to_cht: 你已切换为繁体
cht_to_chs: 你已切换为简体
day_to_night: 你已切换为深色模式

@ -83,19 +83,17 @@ aside:
day: 天前
date_suffix:
one_hour: 剛剛
hours: 小時前
just: 剛剛
min: 分鐘前
hour: 小時前
day: 天前
month: 個月前
donate: 打賞
share: 分享
bookmark:
title: 新增書籤
rightside:
readmode_title: 閱讀模式
font_plus_title: 放大字型
font_minus_title: 縮小字型
translate_title: 簡繁轉換
night_mode_title: 淺色和深色模式轉換
back_to_top: 回到頂部
@ -110,9 +108,6 @@ copy_copyright:
info: 著作權歸作者所有。商業轉載請聯絡作者獲得授權,非商業轉載請註明出處。
Snackbar:
bookmark:
message_prev:
message_next: 鍵將本頁加入書籤
chs_to_cht: 你已切換為繁體
cht_to_chs: 你已切換為簡體
day_to_night: 你已切換為深色模式

@ -33,7 +33,7 @@ div
!=partial('includes/loading/loading-js', {}, {cache:theme.fragment_cache})
.js-pjax
if is_home() && theme.subtitle.enable
if theme.subtitle.enable && is_home() && theme.index_img !== false
include ./third-party/subtitle.pug
include ./third-party/math/index.pug

@ -10,7 +10,6 @@
- var isSubtitle = config.subtitle ? ' - ' + config.subtitle : ''
- var tabTitle = is_home() || !pageTitle ? config.title + isSubtitle : pageTitle + ' | ' + config.title
- var pageDescription = page_description()
- var pageKeywords
- if (page.keywords) pageKeywords = Array.isArray(page.keywords) ? (page.keywords).join(',') : ([]).join(',') || page.keywords
- else if (page.tags && page.tags.length) pageKeywords = page.tags.data.map(function(tag) {return tag.name;}).join(',')
@ -23,7 +22,6 @@ meta(charset='UTF-8')
meta(http-equiv="X-UA-Compatible" content="IE=edge")
meta(name="viewport" content="width=device-width,initial-scale=1")
title= tabTitle
meta(name="description" content!=pageDescription)
if pageKeywords
meta(name="keywords" content=pageKeywords)
meta(name="author" content=pageAuthor)
@ -35,6 +33,9 @@ if theme.disable_baidu_transformation
meta(http-equiv="Cache-Control" content="no-transform")
meta(http-equiv="Cache-Control" content="no-siteapp")
//- Open_Graph
include ./head/Open_Graph.pug
!=favicon_tag(theme.favicon || config.favicon)
link(rel="canonical" href=urlNoIndex())
@ -44,14 +45,6 @@ link(rel="canonical" href=urlNoIndex())
//- 網站驗證
!=partial('includes/head/site_verification', {}, {cache:theme.fragment_cache})
//- Open_Graph
include ./head/Open_Graph.pug
if theme.facebook_comments.app_id
meta(property="fb:app_id" content=theme.facebook_comments.app_id )
if theme.facebook_comments.user_id
meta(property="fb:admins" content=theme.facebook_comments.user_id)
//- PWA
if (theme.pwa && theme.pwa.enable)
!=partial('includes/head/pwa', {}, {cache:theme.fragment_cache})

@ -1,12 +1,11 @@
- var contentType = is_post() ? 'article' : 'website'
if theme.Open_Graph_meta
meta(property="og:type" content=contentType)
meta(property="og:title" content=pageTitle)
meta(property="og:url" content=urlNoIndex())
meta(property="og:site_name" content=config.title)
meta(property="og:description" content!=pageDescription)
meta(property="og:image" content=full_url_for(page.cover || theme.avatar.img))
meta(property="article:published_time" content=date_xml(page.date))
meta(property="article:modified_time" content=date_xml(page.updated))
meta(name="twitter:card" content="summary")
- let contentType = is_post() ? 'article' : 'website'
- let metaImage = full_url_for(page.cover || theme.avatar.img)
- let fb_appId = theme.facebook_comments.app_id || ''
- let fb_admins = theme.facebook_comments.user_id || ''
!= open_graph({type: contentType, image: metaImage, fb_admins: fb_admins, fb_app_id: fb_appId})
else
meta(name="description" content=page_description())

@ -61,10 +61,6 @@
let Snackbar = 'undefined';
if (theme.snackbar && theme.snackbar.enable) {
Snackbar = JSON.stringify({
bookmark: {
message_prev: _p("Snackbar.bookmark.message_prev"),
message_next: _p("Snackbar.bookmark.message_next")
},
chs_to_cht: _p("Snackbar.chs_to_cht"),
cht_to_chs: _p("Snackbar.cht_to_chs"),
day_to_night: _p("Snackbar.day_to_night"),
@ -94,12 +90,6 @@
})
}
let date_suffix = JSON.stringify({
one_hour: _p("date_suffix.one_hour"),
hours: _p("date_suffix.hours"),
day: _p('date_suffix.day')
})
script.
var GLOBAL_CONFIG = {
root: '!{config.root}',
@ -114,16 +104,21 @@ script.
error: '!{_p("copy.error")}',
noSupport: '!{_p("copy.noSupport")}'
},
bookmark: {
message_prev: '!{_p("Snackbar.bookmark.message_prev")}',
message_next: '!{_p("Snackbar.bookmark.message_next")}'
relativeDate: {
homepage: !{theme.post_meta.page.date_format === 'relative'},
post: !{theme.post_meta.post.date_format === 'relative'}
},
runtime: '!{theme.runtimeshow.enable ? _p("aside.card_webinfo.runtime.unit") : ""}',
date_suffix: !{date_suffix},
date_suffix: {
just: '!{_p("date_suffix.just")}',
min: '!{_p("date_suffix.min")}',
hour: '!{_p("date_suffix.hour")}',
day: '!{_p("date_suffix.day")}',
month: '!{_p("date_suffix.month")}'
},
copyright: !{copyright},
ClickShowText: !{ClickShowText},
medium_zoom: !{theme.medium_zoom},
fancybox: !{theme.fancybox},
lightbox: '!{ theme.medium_zoom ? "mediumZoom" : (theme.fancybox ? "fancybox" : "null" )}',
Snackbar: !{Snackbar},
justifiedGallery: {
js: '!{theme.CDN.justifiedGallery_js}',
@ -144,7 +139,7 @@ script.
expiry: now.getTime() + expiryDay,
}
localStorage.setItem(key, JSON.stringify(item))
},
},
get: function getWithExpiry(key) {
const itemStr = localStorage.getItem(key)

@ -1,9 +1,14 @@
noscript.
<style type="text/css">
#nav {
opacity: 1
}
.justified-gallery img {
opacity: 1
}
#nav {
opacity: 1
}
.justified-gallery img {
opacity: 1
}
#recent-posts time,
#post-meta time {
display: inline !important
}
</style>

@ -1,43 +1,60 @@
if is_home()
- var top_img = theme.index_img || theme.default_top_img
else if is_post()
- var top_img = page.top_img || page.cover || page.randomcover || theme.default_top_img
else if is_archive()
- var top_img = theme.archive_img || theme.default_top_img
else if is_tag()
- var top_img = theme.tag_img || theme.default_top_img
else if is_category()
- var top_img = theme.category_img || theme.default_top_img
else
- var top_img = page.top_img || theme.default_top_img
if page.top_img !== false
if is_post()
- var top_img = page.top_img || page.cover || page.randomcover || theme.default_top_img
else if is_page()
- var top_img = page.top_img || theme.default_top_img
else if is_tag()
- var top_img = theme.tag_per_img && theme.tag_per_img[page.tag]
- top_img = top_img ? top_img : (theme.tag_img !== false ? theme.tag_img || theme.default_top_img : false)
else if is_category()
- var top_img = theme.category_per_img && theme.category_per_img[page.category]
- top_img = top_img ? top_img : (theme.category_img !== false ? theme.category_img || theme.default_top_img : false)
else if is_home()
- var top_img = theme.index_img !== false ? theme.index_img || theme.default_top_img : false
else if is_archive()
- var top_img = theme.archive_img !== false ? theme.archive_img || theme.default_top_img : false
else
- var top_img = page.top_img || theme.default_top_img
if theme.douban
if is_current('/movies/', [strict])
- var top_img = theme.douban.movies_img || theme.default_top_img
else if is_current('/books/', [strict])
- var top_img = theme.douban.books_img || theme.default_top_img
else if is_current('/games/', [strict])
- var top_img = theme.douban.games_img || theme.default_top_img
if theme.douban
- var doubanExist = false
if is_current('/movies/', [strict])
- var top_img = theme.douban.movies_img !== false ? theme.douban.movies_img || theme.default_top_img : false
- doubanExist = true
else if is_current('/books/', [strict])
- var top_img = theme.douban.books_img !== false ? theme.douban.books_img || theme.default_top_img : false
- doubanExist = true
else if is_current('/games/', [strict])
- var top_img = theme.douban.games_img !== false ? theme.douban.games_img || theme.default_top_img : false
- doubanExist = true
- var bg_img = top_img && top_img !== true ? `background-image: url(${url_for(top_img)})` : ''
- var site_title = is_archive() ? _p('page.archives') : page.title || page.tag || page.category || config.title
- var isHomeClass = is_home() ? 'full_page' : 'not-index-bg'
- is_post() ? isHomeClass = 'post-bg' : isHomeClass
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 isHomeClass = is_home() ? 'full_page' : 'not-index-bg'
- is_post() ? isHomeClass = 'post-bg' : isHomeClass
else
- var isHomeClass = 'no-top-img'
else
- var top_img = false
- var isHomeClass = 'no-top-img'
header#page-header(class=isHomeClass style=bg_img)
!=partial('includes/header/nav', {}, {cache:theme.fragment_cache})
if is_home()
#site-info
h1#site_title=site_title
#site_subtitle
span#subtitle
if(theme.social)
#site_social_icons
!=fragment_cache('social', function(){return partial('includes/header/social')})
#scroll_down
i.fas.fa-angle-down.scroll-down-effects
else if is_post()
include ./post-info.pug
else
#page_site-info
h1#site_title=site_title
if top_img !== false
if is_post()
include ./post-info.pug
else if is_home()
#site-info
h1#site_title=site_title
#site_subtitle
span#subtitle
if(theme.social)
#site_social_icons
!=fragment_cache('social', function(){return partial('includes/header/social')})
#scroll_down
i.fas.fa-angle-down.scroll-down-effects
else
#page_site-info
h1#site_title=site_title

@ -33,9 +33,16 @@ html(lang=config.language data-theme=theme.display_mode)
else
block content
- var footer_bg = theme.footer_bg == false ? '' : bg_img
- var is_bg = theme.footer_bg == false ? 'color' : 'photo'
footer#footer(style=footer_bg data-type=is_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:theme.fragment_cache})
include ./rightside.pug

@ -1,6 +1,13 @@
script.
var endLoading = function () {
document.body.style.overflow = 'auto';
document.getElementById('loading-box').classList.add("loaded")
var preloader = {
endLoading: () => {
document.body.style.overflow = 'auto';
document.getElementById('loading-box').classList.add("loaded")
},
initLoading: () => {
document.body.style.overflow = '';
document.getElementById('loading-box').classList.remove("loaded")
}
}
window.addEventListener('load',endLoading)
window.addEventListener('load',()=> {preloader.endLoading()})

@ -57,21 +57,24 @@ mixin postUI(posts)
span.article-meta__link #[='•']
//- Display the article introduction on homepage
if theme.index_post_content.method == 1
.content!= article.description
else if theme.index_post_content.method == 2
if article.description
case theme.index_post_content.method
when false
- break
when 1
.content!= article.description
else
when 2
if article.description
.content!= article.description
else
- const content = strip_html(article.content)
- let expert = content.substring(0, theme.index_post_content.length)
- content.length > theme.index_post_content.length ? expert += ' ...' : ''
.content!= expert
default
- const content = strip_html(article.content)
- let expert = content.substring(0, theme.index_post_content.length)
- content.length > theme.index_post_content.length ? expert += ' ...' : ''
.content!= expert
else
- const content = strip_html(article.content)
- let expert = content.substring(0, theme.index_post_content.length)
- content.length > theme.index_post_content.length ? expert += ' ...' : ''
.content!= expert
if theme.ad && theme.ad.index
if (index + 1) % 3 == 0

@ -52,10 +52,14 @@ script.
// prismjs
typeof Prism === 'object' && Prism.highlightAll()
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) {

@ -7,18 +7,18 @@
- let postLimit = theme.aside.card_recent_post.limit === 0 ? site.posts.length : theme.aside.card_recent_post.limit || 5
- let sort = theme.aside.card_recent_post.sort === 'updated' ? 'updated' : 'date'
- site.posts.sort(sort, -1).limit(postLimit).each(function(article){
.aside-list-item
- let link = article.link || article.path
- let title = article.title || _p('no_title')
- let no_cover = article.cover === false || !theme.cover.aside_enable ? 'no-aside-cover' : ''
- let post_cover = article.cover
- let link = article.link || article.path
- let title = article.title || _p('no_title')
- let no_cover = article.cover === false || !theme.cover.aside_enable ? 'no-cover' : ''
- let post_cover = article.cover
.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)
.content(class=no_cover)
.content
a.title(href=url_for(link) title=title)= title
if theme.aside.card_recent_post.sort === 'updated'
time(datetime=date_xml(article.updated) title=_p('post.updated') + ' ' + full_date(article.updated)) #[=date(article.updated, config.date_format)]

@ -25,10 +25,12 @@ block content
!=partial('includes/third-party/comments/index', {}, {cache:theme.fragment_cache})
else
#page
if theme.douban && theme.douban.meta
if (is_current('/movies/', [strict]) || is_current('/books/', [strict]) || is_current('/games/', [strict]))
meta(name="referrer" content="no-referrer")
#article-container!= page.content
if theme.douban && theme.douban.meta && doubanExist
meta(name="referrer" content="no-referrer")
#article-container
if top_img === false
h1.page-title= page.title
!= page.content
if page.comments !== false && theme.comments && theme.comments.use
- var commentsJsLoad = true
!=partial('includes/third-party/comments/index', {}, {cache:theme.fragment_cache})

@ -2,6 +2,9 @@ extends includes/layout.pug
block content
article#post(class="")
if top_img === false
include includes/header/post-info.pug
#article-container.post-content!=page.content
include includes/post/post-copyright.pug
.tag_share

@ -1,6 +1,6 @@
{
"name": "hexo-theme-butterfly",
"version": "3.1.0",
"version": "3.2.0-b1",
"description": "A Simple and Card UI Design theme for Hexo",
"main": "package.json",
"scripts": {
@ -23,7 +23,7 @@
"email": "wong@jerryc.me"
},
"dependencies": {
"hexo-renderer-stylus": "^2.0.0",
"hexo-renderer-stylus": "^2.0.1",
"hexo-renderer-pug": "^1.0.0"
},
"homepage": "https://demo.jerryc.me/",

@ -150,6 +150,7 @@
& > time,
& > .name
display: block
color: $theme-meta-color
font-size: 85%
@ -164,13 +165,8 @@
&:hover
color: $text-hover
.card-recent-post
.thumbnail
border-radius: 0 !important
.no-aside-cover
title
height: auto
&.no-cover
min-height: 4.4em
.card-archives ul.card-archive-list,
.card-categories ul.card-category-list

@ -102,66 +102,101 @@
background-color: alpha($dark-black, .5)
content: ''
#post-info
position: absolute
bottom: 1.5rem
padding: 0 8%
width: 100%
text-align: left
&.no-top-img
margin-bottom: .5rem
height: 60px
background: 0
#nav
background: rgba(255, 255, 255, .8)
box-shadow: 0 5px 6px -5px rgba(133, 133, 133, .6)
a
color: var(--font-color)
text-shadow: none
#post-info
position: absolute
bottom: 1.5rem
padding: 0 8%
width: 100%
text-align: left
+maxWidth768()
bottom: 1.1rem
padding: 0 1.1rem
#post-info
#post-title
margin-bottom: .4rem
font-size: 2.15em
+maxWidth768()
font-size: 1.72em
.posttitle
@extend .limit-more-line
color: var(--white)
line-height: 1.5
-webkit-line-clamp: 3
+maxWidth768()
bottom: 1.1rem
padding: 0 1.1rem
#post-meta
color: var(--light-grey)
font-size: 95%
#post-title
margin-bottom: .4rem
font-size: 2.15em
+minWidth768()
> .meta-secondline
> span:first-child
display: none
+maxWidth768()
font-size: 1.72em
+maxWidth768()
font-size: 90%
.posttitle
@extend .limit-more-line
color: var(--white)
line-height: 1.5
-webkit-line-clamp: 3
> .meta-firstline,
> .meta-secondline
display: inline
#post-meta
color: var(--light-grey)
font-size: 95%
.post-meta
&-separator
margin: 0 .25rem
+minWidth768()
> .meta-secondline
> span:first-child
display: none
&-icon
margin-right: .2rem
+maxWidth768()
font-size: 90%
&-label
if hexo-config('post_meta.post.label')
margin-right: .2rem
else
display: none
> .meta-firstline,
> .meta-secondline
display: inline
a
color: var(--light-grey)
transition: all .3s ease-out
.post-meta
&-separator
margin: 0 .25rem
&:hover
color: $text-hover
text-decoration: underline
&-icon
margin-right: .2rem
if hexo-config('post_meta.post.date_format') == 'relative'
time
display: none
&-label
if hexo-config('post_meta.post.label')
margin-right: .2rem
else
display: none
// for not top_img
#post
& > #post-info
margin-bottom: 1.5rem
a
color: var(--light-grey)
transition: all .3s ease-out
.posttitle
padding-bottom: .2rem
border-bottom: 1px solid var(--light-grey)
color: var(--text-highlight-color)
&:hover
color: $text-hover
text-decoration: underline
[data-theme='light']
#post
#post-info
#post-meta,
#post-meta a
color: #78818a
// css hack
// all browser in ios and safari in all apple device
@ -210,7 +245,7 @@ _:future,
&.fixed
position: fixed
top: -62px
top: -60px
z-index: 91
background: rgba(255, 255, 255, .8)
box-shadow: 0 5px 6px -5px alpha($grey, .6)

@ -5,7 +5,6 @@ if hexo-config('preloader')
width: 50%
height: 100%
background-color: var(--preloader-bg)
transition: all .5s
#loading-box
.loading-left-bg
@ -53,9 +52,11 @@ if hexo-config('preloader')
&.loaded
.loading-left-bg
transition: all .5s
transform: translate(-100%, 0)
.loading-right-bg
transition: all .5s
transform: translate(100%, 0)
.spinner-box

@ -291,6 +291,9 @@ img
iframe
margin: 0 0 1rem
& > .page-title
margin-top: .4rem
.post-outdate-notice
position: relative
margin: 0 0 1rem

@ -29,20 +29,19 @@ if hexo-config('darkmode.enable') || hexo-config('display_mode') == 'dark'
--sidebar-icon-color: alpha(#FFFFFF, .6)
// footer
#web_bg[data-type=color],
#footer[data-type=color]
#web_bg[data-type=color]
background: darken(#121212, 2)
#web_bg[data-type=photo]:before,
#footer[data-type=photo]:before
#web_bg[data-type=photo]:before
position: absolute
width: 100%
height: 100%
background-color: alpha($dark-black, .7)
content: ''
#page-header
background-color: #121212
#footer
&:before
background-color: alpha($dark-black, .7)
#article-container
code
@ -67,10 +66,10 @@ if hexo-config('darkmode.enable') || hexo-config('display_mode') == 'dark'
background-color: alpha($dark-black, .7)
content: ''
& > #nav
&.fixed
background: alpha(#121212, .8)
box-shadow: 0 5px 6px -5px rgba(133, 133, 133, 0)
& > #nav.fixed,
&.no-top-img #nav
background: alpha(#121212, .8)
box-shadow: 0 5px 6px -5px rgba(133, 133, 133, 0)
//
#article-container

@ -107,6 +107,10 @@
.fa-angle-right
margin: 0 .2rem
if hexo-config('post_meta.page.date_format') == 'relative'
time
display: none
a
color: $theme-meta-color

@ -159,14 +159,18 @@ $(function () {
})
const mql = window.matchMedia('(max-width: 1024px)')
mql.addListener((ev) => {
const $toggleSidebar = $('#toggle-sidebar')
const matchFn = (ev) => {
if (ev.matches) {
if ($sidebar.hasClass('tocOpenPc')) closeSidebar()
} else {
if ($('#toggle-sidebar').hasClass('on')) openSidebar()
if ($toggleSidebar.hasClass('on')) openSidebar()
if ($mobileTocButton.hasClass('open')) closeMobileSidebar('toc')
}
})
}
mql.addListener(matchFn)
document.addEventListener('pjax:send', () => { mql.removeListener(matchFn) })
// toc元素點擊
$sidebar.find('.toc-link').on('click', function (e) {
@ -345,9 +349,7 @@ $(function () {
* fancybox和 mediumZoom
*/
const addLightBox = function () {
const isMediumZoom = GLOBAL_CONFIG.medium_zoom
const isFancybox = GLOBAL_CONFIG.fancybox
if (isFancybox) {
if (GLOBAL_CONFIG.lightbox === 'fancybox') {
const images = $('#article-container img:not(.gallery-group-img)').not($('a>img'))
images.each(function (i, o) {
const lazyloadSrc = $(o).attr('data-lazy-src') ? $(o).attr('data-lazy-src') : $(o).attr('src')
@ -363,7 +365,7 @@ $(function () {
buttons: ['slideShow', 'fullScreen', 'thumbs', 'close'],
hash: false
})
} else if (isMediumZoom) {
} else {
const zoom = mediumZoom(document.querySelectorAll('#article-container :not(a)>img'))
zoom.on('open', function (event) {
const photoBg = $(document.documentElement).attr('data-theme') === 'dark' ? '#121212' : '#fff'
@ -425,14 +427,18 @@ $(function () {
* toc
*/
const tocFn = function () {
$('.toc-child').hide()
const $sidebar = $('#sidebar')
const $tocChild = $sidebar.find('.toc-child')
const $tocLink = $sidebar.find('.toc-link')
const $article = $('#article-container')
$tocChild.hide()
// main of scroll
$(window).scroll(btf.throttle(function (event) {
const currentTop = $(this).scrollTop()
scrollPercent(currentTop)
findHeadPosition(currentTop)
autoScrollToc(currentTop)
}, 100))
// expand toc-item
@ -444,18 +450,17 @@ $(function () {
}
const scrollPercent = function (currentTop) {
const $dom = $('#article-container')
const docHeight = $dom.height()
const docHeight = $article.height()
const winHeight = $(window).height()
const headerHeight = $dom.offset().top
const headerHeight = $article.offset().top
const contentMath = (docHeight > winHeight) ? (docHeight - winHeight) : ($(document).height() - winHeight)
const scrollPercent = (currentTop - headerHeight) / (contentMath)
const scrollPercentRounded = Math.round(scrollPercent * 100)
const percentage = (scrollPercentRounded > 100) ? 100
: (scrollPercentRounded <= 0) ? 0
: scrollPercentRounded
$('#sidebar .progress-num').text(percentage)
$('#sidebar .sidebar-toc__progress-bar').animate({
$sidebar.find('.progress-num').text(percentage)
$sidebar.find('.sidebar-toc__progress-bar').animate({
width: percentage + '%'
}, 100)
}
@ -468,19 +473,32 @@ $(function () {
}
}
const autoScrollToc = function (currentTop, item) {
const activePosition = item.offset().top
const $tocContent = $sidebar.find('.sidebar-toc__content')
const sidebarScrollTop = $tocContent.scrollTop()
if (activePosition > (currentTop + $(window).height() - 100)) {
$tocContent.scrollTop(sidebarScrollTop + 100)
}
if (activePosition < currentTop + 100) {
$tocContent.scrollTop(sidebarScrollTop - 100)
}
}
// find head position & add active class
// DOM Hierarchy:
// ol.toc > (li.toc-item, ...)
// li.toc-item > (a.toc-link, ol.toc-2child > (li.toc-item, ...))
const versionBiggerFive = GLOBAL_CONFIG.hexoversion.split('.')[0] >= 5
const list = $article.find('h1,h2,h3,h4,h5,h6')
const findHeadPosition = function (top) {
// assume that we are not in the post page if no TOC link be found,
// thus no need to update the status
if ($('.toc-link').length === 0) {
if ($tocLink.length === 0) {
return false
}
const list = $('#article-container').find('h1,h2,h3,h4,h5,h6')
let currentId = ''
list.each(function () {
const head = $(this)
@ -491,18 +509,19 @@ $(function () {
})
if (currentId === '') {
$('.toc-link').removeClass('active')
$('.toc-child').hide()
$tocLink.removeClass('active')
$tocChild.hide()
}
const currentActive = $('.toc-link.active')
const currentActive = $tocLink.filter('.active')
if (currentId && currentActive.attr('href') !== currentId) {
if (isAnchor) updateAnchor(currentId)
$('.toc-link').removeClass('active')
$tocLink.removeClass('active')
const _this = $('.toc-link[href="' + currentId + '"]')
const _this = $tocLink.filter('[href="' + currentId + '"]')
_this.addClass('active')
autoScrollToc(top, _this)
const parents = _this.parents('.toc-child')
// Returned list is in reverse order of the DOM elements
@ -518,19 +537,6 @@ $(function () {
.find('.toc-child').hide()
}
}
const autoScrollToc = function (currentTop) {
if ($('.toc-link').hasClass('active')) {
const activePosition = $('.active').offset().top
const sidebarScrollTop = $('#sidebar .sidebar-toc__content').scrollTop()
if (activePosition > (currentTop + $(window).height() - 100)) {
$('#sidebar .sidebar-toc__content').scrollTop(sidebarScrollTop + 100)
}
if (activePosition < currentTop + 100) {
$('#sidebar .sidebar-toc__content').scrollTop(sidebarScrollTop - 100)
}
}
}
}
/**
@ -766,6 +772,14 @@ $(function () {
})
}
const relativeDate = function (selector) {
selector.each((i, o) => {
const $this = $(o)
const timeVal = $this.attr('datetime')
$this.text(btf.diffDate(timeVal, true)).css('display', 'inline')
})
}
const unRefreshFn = function () {
$(window).on('resize', function () {
if (window.innerWidth < 768) adjustMenu(0)
@ -787,6 +801,12 @@ $(function () {
toggleSidebar()
GLOBAL_CONFIG_SITE.isSidebar && tocFn()
GLOBAL_CONFIG.noticeOutdate !== undefined && addPostOutdateNotice()
GLOBAL_CONFIG.relativeDate.post && relativeDate($('#post-meta time'))
} else {
GLOBAL_CONFIG.relativeDate.homepage && relativeDate($('#recent-posts time'))
GLOBAL_CONFIG.runtime && addRuntime()
addLastPushDate()
toggleCardCategory()
}
sidebarFn()
@ -794,15 +814,12 @@ $(function () {
GLOBAL_CONFIG.highlight && addHighlightTool()
GLOBAL_CONFIG.isPhotoFigcaption && addPhotoFigcaption()
runJustifiedGallery()
addLightBox()
GLOBAL_CONFIG.lightbox !== 'null' && addLightBox()
scrollFn()
GLOBAL_CONFIG.runtime && addRuntime()
addLastPushDate()
addTableWrap()
clickFnOfTagHide()
tabsFn.clickFnOfTabs()
tabsFn.backToTop()
toggleCardCategory()
switchComments()
}

@ -102,20 +102,33 @@ var btf = {
const dateNow = new Date()
const datePost = new Date(d)
const dateDiff = dateNow.getTime() - datePost.getTime()
const dayDiff = Math.floor(dateDiff / (24 * 3600 * 1000))
const minute = 1000 * 60
const hour = minute * 60
const day = hour * 24
const month = day * 30
let result
if (more) {
if (dateDiff <= 3600000) { // < 1 hour
result = GLOBAL_CONFIG.date_suffix.one_hour
} else if (dateDiff < 3600000 * 24) { // 1 hour < x < 24 hours
result = Math.floor(dateDiff / 3600000) + ' ' + GLOBAL_CONFIG.date_suffix.hours
} else if (dayDiff >= 1 || dayDiff < 365) { // 1 day < x < 365 days
result = dayDiff + ' ' + GLOBAL_CONFIG.date_suffix.day
} else { // > 365 days
result = d.toLocaleDateString().replace(/\//g, '-')
const monthCount = dateDiff / month
const dayCount = dateDiff / day
const hourCount = dateDiff / hour
const minuteCount = dateDiff / minute
if (monthCount > 12) {
result = datePost.toLocaleDateString().replace(/\//g, '-')
} else if (monthCount >= 1) {
result = parseInt(monthCount) + ' ' + GLOBAL_CONFIG.date_suffix.month
} else if (dayCount >= 1) {
result = parseInt(dayCount) + ' ' + GLOBAL_CONFIG.date_suffix.day
} else if (hourCount >= 1) {
result = parseInt(hourCount) + ' ' + GLOBAL_CONFIG.date_suffix.hour
} else if (minuteCount >= 1) {
result = parseInt(minuteCount) + ' ' + GLOBAL_CONFIG.date_suffix.min
} else {
result = GLOBAL_CONFIG.date_suffix.just
}
} else {
result = dayDiff
result = parseInt(dateDiff / day)
}
return result
},

Loading…
Cancel
Save