fix: 修復本地搜索文章鏈接無法跳轉bugs

feat: 當點擊評論框時,valine背景圖片隱藏
feat: 網頁進入動畫效果可關閉
style: 部分css和js 調整
This commit is contained in:
Jerry
2020-09-19 23:46:53 +08:00
parent c7318a3793
commit a2551d2d29
17 changed files with 272 additions and 258 deletions

View File

@@ -497,6 +497,9 @@ footer_bg: false
# the position of bottom right button/default unit: px (右下角按鈕距離底部的距離/默認單位為px)
rightside-bottom:
# Enter transitions (開啓網頁進入效果)
enter_transitions: true
# Background effects (背景特效)
# --------------------------------------

View File

@@ -68,4 +68,7 @@ div
include ./head/aplayer.pug
if theme.pjax.enable
!=partial('includes/third-party/pjax', {}, {cache:theme.fragment_cache})
!=partial('includes/third-party/pjax', {}, {cache:theme.fragment_cache})
!=partial('includes/third-party/baidu_push', {}, {cache:theme.fragment_cache})

View File

@@ -124,7 +124,6 @@ script.
js: '!{theme.CDN.justifiedGallery_js}',
css: '!{theme.CDN.justifiedGallery_css}'
},
baiduPush: !{theme.baidu_push},
isPhotoFigcaption: !{theme.photofigcaption},
islazyload: !{theme.lazyload.enable},
isanchor: !{theme.anchor}

View File

@@ -47,14 +47,14 @@ header#page-header(class=isHomeClass style=bg_img)
include ./post-info.pug
else if is_home()
#site-info
h1#site_title=site_title
#site_subtitle
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
#scroll-down
i.fas.fa-angle-down.scroll-down-effects
else
#page_site-info
h1#site_title=site_title
#page-site-info
h1#site-title=site_title

View File

@@ -78,4 +78,4 @@ mixin postUI(posts)
if theme.ad && theme.ad.index
if (index + 1) % 3 == 0
.recent-post-item.ad_height!=theme.ad.index
.recent-post-item.ad-height!=theme.ad.index

View File

@@ -1 +1,4 @@
if top_img === false
h1.page-title= page.title
#artitalk_main

View File

@@ -0,0 +1,15 @@
if theme.baidu_push
script.
(function(){
const bp = document.createElement('script');
const curProtocol = window.location.protocol.split(':')[0];
if (curProtocol === 'https'){
bp.src = 'https://zz.bdstatic.com/linksubmit/push.js';
}
else{
bp.src = 'http://push.zhanzhang.baidu.com/push.js';
}
bp.dataset.pjax = ''
const s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(bp, s);
})()

View File

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

View File

@@ -45,31 +45,189 @@ minWidth2000()
@media screen and (min-width: 2000px)
{block}
[data-theme='light']
--global-bg: $body-bg
--font-color: $font-black
--hr-border: lighten($theme-hr-color, 50%)
--hr-before-color: lighten($theme-hr-color, 30%)
--search-bg: $search-bg
--search-input-color: $search-input-color
--search-result-title: $search-result-title
--preloader-bg: $preloader-bg
--preloader-color: $preloader-word-color
--tab-border-color: $tab-border-color
--tab-botton-bg: $tab-botton-bg
--tab-botton-color: $tab-botton-color
--tab-button-hover-bg: $tab-button-hover-bg
--tab-button-active-bg: $tab-button-active-bg
--card-bg: $card-bg
--sidebar-bg: $sidebar-background
--btn-hover-color: $button-hover-color
--btn-color: $button-color
--btn-bg: $button-bg
--text-bg-hover: $text-bg-hover
--light-grey: $light-grey
--white: $white
--text-highlight-color: $text-highlight-color
--blockquote-color: $blockquote-color
--blockquote-bg: $blockquote-background-color
--reward-pop: $reward-pop-up-bg
--sidebar-icon-color: $sidebar-icon-color
// animation
if hexo-config('enter_transitions')
#content-inner,
#footer
animation: main 1s
#page-header
animation: header-effect 1s
#site-title,
#site-subtitle
animation: titlescale 1s
#nav.show
animation: headerNoOpacity 1s
canvas:not(#ribbon-canvas),
#web_bg
animation: to_show 4s
#ribbon-canvas
animation: ribbon_to_show 4s
.tocOpenPc
.sidebar-toc__title
animation: tocsidebarLtoR .5s
.sidebar-toc__progress
animation: tocsidebarLtoR .7s
.sidebar-toc__content
animation: tocsidebarLtoR .9s
.tocOpenMobile
.sidebar-toc__title
animation: tocsidebarRtoL .4s
.sidebar-toc__progress
animation: tocsidebarRtoL .6s
.sidebar-toc__content
animation: tocsidebarRtoL .7s
#mobile-sidebar-menus
&.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
.scroll-down-effects
animation: scroll-down-effect 1.5s infinite
if hexo-config('avatar.effect') == true
.avatar-img
animation: avatar_turn_around 2s linear infinite
.reward-main
animation: donate_effcet .3s .1s ease both
@keyframes scroll-down-effect
0%
top: 0
opacity: .4
50%
top: -16px
opacity: 1
100%
top: 0
opacity: .4
@keyframes header-effect
0%
opacity: 0
transform: translateY(-50px)
100%
opacity: 1
transform: translateY(0)
@keyframes headerNoOpacity
0%
transform: translateY(-50px)
100%
transform: translateY(0)
@keyframes main
0%
opacity: 0
transform: translateY(50px)
100%
opacity: 1
transform: translateY(0)
@keyframes titlescale
0%
opacity: 0
transform: scale(.7)
100%
opacity: 1
transform: scale(1)
@keyframes search_close
0%
opacity: 1
transform: scale(1)
100%
opacity: 0
transform: scale(.7)
@keyframes to_show
0%
opacity: 0
100%
opacity: 1
@keyframes ribbon_to_show
0%
opacity: 0
100%
opacity: hexo-config('canvas_ribbon.alpha')
@keyframes avatar_turn_around
from
transform: rotate(0)
to
transform: rotate(360deg)
@keyframes sub_menus
0%
opacity: 0
transform: translateY(10px)
100%
opacity: 1
transform: translateY(0)
@keyframes donate_effcet
0%
opacity: 0
transform: translateY(-20px)
100%
opacity: 1
transform: translateY(0)
@keyframes announ_animation
0%,
to
transform: scale(1)
50%
transform: scale(1.2)
@keyframes sidebarItem
0%
transform: translateX(200px)
100%
transform: translateX(0)
@keyframes tocsidebarRtoL
0%
transform: translateX(200px)
100%
transform: translateX(0)
@keyframes tocsidebarLtoR
0%
transform: translateX(-200px)
100%
transform: translateX(0)

View File

@@ -1,3 +1,32 @@
[data-theme='light']
--global-bg: $body-bg
--font-color: $font-black
--hr-border: lighten($theme-hr-color, 50%)
--hr-before-color: lighten($theme-hr-color, 30%)
--search-bg: $search-bg
--search-input-color: $search-input-color
--search-result-title: $search-result-title
--preloader-bg: $preloader-bg
--preloader-color: $preloader-word-color
--tab-border-color: $tab-border-color
--tab-botton-bg: $tab-botton-bg
--tab-botton-color: $tab-botton-color
--tab-button-hover-bg: $tab-button-hover-bg
--tab-button-active-bg: $tab-button-active-bg
--card-bg: $card-bg
--sidebar-bg: $sidebar-background
--btn-hover-color: $button-hover-color
--btn-color: $button-color
--btn-bg: $button-bg
--text-bg-hover: $text-bg-hover
--light-grey: $light-grey
--white: $white
--text-highlight-color: $text-highlight-color
--blockquote-color: $blockquote-color
--blockquote-bg: $blockquote-background-color
--reward-pop: $reward-pop-up-bg
--sidebar-icon-color: $sidebar-icon-color
html
height: 100%
font-size: 20px
@@ -112,8 +141,8 @@ button
cursor: pointer
// font
#page-header #site_title,
#page-header #site_subtitle,
#site-title,
#site-subtitle,
#site-name,
#aside_content .author-info__name,
#aside_content .author-info__description
@@ -168,191 +197,6 @@ img:not([src])
.post-ad
margin: 2rem 0
.ad_height
.ad-height
display: block !important
height: auto !important
// animation
#content-inner,
#footer
animation: main 1s
#page-header
animation: header-effect 1s
#site_title,
#site_subtitle
animation: titlescale 1s
canvas:not(#ribbon-canvas),
#web_bg
animation: to_show 4s
#ribbon-canvas
animation: ribbon_to_show 4s
.card-announcement-animation
color: #FF0000
animation: announ_animation .8s linear infinite
.scroll-down-effects
animation: scroll-down-effect 1.5s infinite
if hexo-config('avatar.effect') == true
.avatar-img
animation: avatar_turn_around 2s linear infinite
.reward-main
animation: donate_effcet .3s .1s ease both
.tocOpenPc
.sidebar-toc__title
animation: tocsidebarLtoR .5s
.sidebar-toc__progress
animation: tocsidebarLtoR .7s
.sidebar-toc__content
animation: tocsidebarLtoR .9s
.tocOpenMobile
.sidebar-toc__title
animation: tocsidebarRtoL .4s
.sidebar-toc__progress
animation: tocsidebarRtoL .6s
.sidebar-toc__content
animation: tocsidebarRtoL .7s
#mobile-sidebar-menus
&.open
transform: translate3d(-100%, 0, 0)
for i in 1 2 3 4
> :nth-child({i})
animation: sidebarItem (i / 5)s
@keyframes scroll-down-effect
0%
top: 0
opacity: .4
50%
top: -16px
opacity: 1
100%
top: 0
opacity: .4
@keyframes header-effect
0%
opacity: 0
transform: translateY(-50px)
100%
opacity: 1
transform: translateY(0)
@keyframes headerNoOpacity
0%
transform: translateY(-50px)
100%
transform: translateY(0)
@keyframes main
0%
opacity: 0
transform: translateY(50px)
100%
opacity: 1
transform: translateY(0)
@keyframes titlescale
0%
opacity: 0
transform: scale(.7)
100%
opacity: 1
transform: scale(1)
@keyframes search_close
0%
opacity: 1
transform: scale(1)
100%
opacity: 0
transform: scale(.7)
@keyframes to_show
0%
opacity: 0
100%
opacity: 1
@keyframes ribbon_to_show
0%
opacity: 0
100%
opacity: hexo-config('canvas_ribbon.alpha')
@keyframes avatar_turn_around
from
transform: rotate(0)
to
transform: rotate(360deg)
@keyframes sub_menus
0%
opacity: 0
transform: translateY(10px)
100%
opacity: 1
transform: translateY(0)
@keyframes donate_effcet
0%
opacity: 0
transform: translateY(-20px)
100%
opacity: 1
transform: translateY(0)
@keyframes announ_animation
0%,
to
transform: scale(1)
50%
transform: scale(1.2)
@keyframes sidebarItem
0%
transform: translateX(200px)
100%
transform: translateX(0)
@keyframes tocsidebarRtoL
0%
transform: translateX(200px)
100%
transform: translateX(0)
@keyframes tocsidebarLtoR
0%
transform: translateX(-200px)
100%
transform: translateX(0)
height: auto !important

View File

@@ -19,14 +19,14 @@
padding: 0 .5rem
width: 100%
#site_title,
#site_subtitle,
#scroll_down .scroll-down-effects
#site-title,
#site-subtitle,
#scroll-down .scroll-down-effects
text-align: center
text-shadow: .1rem .1rem .2rem rgba(0, 0, 0, .15)
line-height: 1.5
#site_title
#site-title
margin: 0
color: var(--white)
font-size: 1.85em
@@ -34,7 +34,7 @@
+minWidth768()
font-size: 2.85em
#site_subtitle
#site-subtitle
color: var(--light-grey)
font-size: 1.15em
@@ -57,7 +57,7 @@
font-size: 1.43em
cursor: pointer
#scroll_down
#scroll-down
position: absolute
bottom: 0
width: 100%
@@ -76,7 +76,7 @@
+maxWidth768()
height: 14rem
#page_site-info
#page-site-info
position: absolute
top: 10rem
padding: 0 .5rem
@@ -228,7 +228,6 @@ _:future,
&.show
opacity: 1
animation: headerNoOpacity 1s
#blog_name
flex: 1

View File

@@ -19,6 +19,9 @@
background: var(--sidebar-bg)
transition: all .5s
&.open
transform: translate3d(-100%, 0, 0)
& > .mobile_author_icon
padding: 1.3rem 1.5rem 0
text-align: center

View File

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

View File

@@ -1,5 +1,5 @@
#vcomment
font-size: 1.15em
font-size: 1.1em
.vbtn
border: none
@@ -13,6 +13,9 @@
textarea
background: url(hexo-config('valine.bg')) 100% 100% no-repeat
&:focus
background: none
.vimg
transition: all .3s

View File

@@ -43,4 +43,8 @@ if hexo-config('aside.position') == 'left'
+minWidth900()
.layout_page
& > div:first-child
order: 2
order: 2
#page
h1.page-title
margin-top: .4rem

View File

@@ -186,7 +186,7 @@ $(function () {
* 首頁top_img底下的箭頭
*/
const scrollDownInIndex = () => {
$('#scroll_down').on('click', function () {
$('#scroll-down').on('click', function () {
btf.scrollToDest('#content-inner')
})
}
@@ -656,22 +656,6 @@ $(function () {
})
}
/**
* 百度推送
*/
const pushToBaidu = () => {
const bp = document.createElement('script')
const curProtocol = window.location.protocol.split(':')[0]
if (curProtocol === 'https') {
bp.src = 'https://zz.bdstatic.com/linksubmit/push.js'
} else {
bp.src = 'http://push.zhanzhang.baidu.com/push.js'
}
bp.dataset.pjax = ''
const s = document.getElementsByTagName('script')[0]
s.parentNode.insertBefore(bp, s)
}
/**
* tag-hide
*/
@@ -789,7 +773,6 @@ $(function () {
clickFnOfSubMenu()
GLOBAL_CONFIG.islazyload && lazyloadImg()
GLOBAL_CONFIG.copyright !== undefined && addCopyright()
GLOBAL_CONFIG.baiduPush && pushToBaidu()
}
window.refreshFn = function () {

View File

@@ -62,7 +62,7 @@ $(function () {
return {
title: $('title', this).text(),
content: $('content', this).text(),
url: $('url', this).text()
url: GLOBAL_CONFIG.root + $('url', this).text()
}
}).get()