biss/hexo-theme-butterfly
1
0
Fork 0
mirror of https://github.com/jerryc127/hexo-theme-butterfly.git synced 2026-04-16 20:30:53 +08:00
Code Issues Packages Projects Releases Wiki Activity

1. Feature: 手機menu界面重新設計

Browse Source 
2. Feature: 文章頁增加美化（原 melody主題功能),並增加更改標題前綴圖標和顔色
3. Feature: PC端增加直達評論按鈕
4. Feature: 可以對單獨文章設置是否顯示版權信息
5. Fix: 修復閲讀模式下，調整字體大小對代碼無效的bug
6. Fix: 調整Valine字體顯示問題
7. Fix: 修正夜間模式下Valine的適配問題
8. Fix: 修復Valine設置notify和verify無效的bug (thx @VincentTV )
9. Remove: 去掉主題"閲讀更多"按鈕
This commit is contained in:
Jerry
2019-08-29 01:09:28 +08:00
Unverified
parent 3bf033c9e4
commit da8ffda39b
23 changed files with 346 additions and 236 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
source/css/_layout/aside.styl
View File

@@ -54,7 +54,7 @@
.headline
display: block
font-size: 0.7rem
letter-spacing: 1px
// letter-spacing: 1px
margin-bottom: -21px
text-transform: uppercase
color:#4c4948

7
source/css/_layout/footer.styl
View File

@@ -2,11 +2,8 @@ footer
margin-top: 1rem
background: $light-blue
background-attachment: local
&.footer-bg
background-position: bottom
background-size: cover
background-position: bottom
background-size: cover
#footer
padding: 1.2rem 1rem 1rem

108
source/css/_layout/head.styl
View File

@@ -103,11 +103,23 @@
-webkit-transform: rotate(-45deg) translate(4px, -4px)
transform: rotate(-45deg) translate(4px, -4px)
.menu_mask
position: fixed
top: 0
bottom: 0
width: 100%
height: 110vh
left: 0
right: 0
background: alpha($black,0.7)
display: none
.menus
.mobile_author_icon
display: none
padding: 3rem 1.5rem 0
padding: 1.3rem 1.5rem 0
text-align: center
img
height: 120px
@@ -115,24 +127,35 @@
display: inline-block
vertical-align: top
border-radius: 70px
-webkit-transition: all .3s
-moz-transition: all .3s
-o-transition: all .3s
-ms-transition: all .3s
transition: all .3s
.mobile_post_data
display: flex
justify-content: center
padding: .6rem .5rem 0
display: none
.mobile_data_item
flex: 1
.mobile_data_link
a
text-decoration: none
.length_num
font-size: .9rem
color: #000
.headline
display: block
font-size: 0.7rem
// letter-spacing: .5px
text-transform: uppercase
color:#4c4948
hr
margin: 1rem auto
display: none
&.menu_open
display: block
animation: menu_open .3s
&.menu_close
animation: menu_close .3s
display: block
a
color: $light-grey
@@ -210,7 +233,6 @@
font-size: 1.2rem
@media screen and (max-width: $sm)
#page-header
padding: 10px 0.8rem
@@ -220,41 +242,49 @@
.menus
position: fixed
top: 0
right: 0
width: 100%
right: -250px
width: 250px
height 101vh
background: $white
cursor: pointer
box-shadow: 0 0 4px rgba(0, 0, 0, 0.27)
z-index: -1
overflow: auto
z-index: 1
overflow-y: scroll
display: none
.mobile_post_data
display: flex
a
display: inline-block !important
opacity: 1 !important
// margin-left: 0
// padding-top: 0.3rem
// padding-bottom: 0.3rem
// padding-left: 0.6rem
margin: 0
padding: .5rem 1rem
color: $font-black
text-shadow: none
font-size: 0.8rem
z-index: 0
.menus_item
a
display: block !important
opacity: 1 !important
margin: 0
padding: .3rem 1.5rem
color: $font-black
text-shadow: none
font-size: 0.8rem
z-index: 0
text-overflow: ellipsis
overflow: hidden
white-space: nowrap
i
width: 30%
text-align: left
span
width 70%
&:hover
color: $light-blue
&:hover
color: $light-blue
.mobile_author_icon
display: block
.menus_item
padding: 0 .5rem
margin-bottom: 4rem
text-align: center
margin-bottom: 5rem
hr
display: block
@@ -267,5 +297,5 @@
&.fixed.open-sidebar
.search
display: inline-block;
opacity: 1;
display: inline-block
opacity: 1

33
source/css/_layout/nightshift.styl
View File

@@ -39,7 +39,7 @@ if hexo-config("nightshift") && hexo-config("nightshift.enable")
// 評論
#vcomment
*
p,a,textarea,.vemoji-btn,.vpreview-btn,input,path,.vcount,.vnum,.vtime,.vsys,.vsys,.vnick
color: #99a9bf !important
.vsys
@@ -48,6 +48,26 @@ if hexo-config("nightshift") && hexo-config("nightshift.enable")
.vbtn
background: rgb(45, 48, 53) !important
color: #99a9bf !important
border: 1px solid #99a9bf
.vwrap
border: 1px solid #99a9bf
input
border-bottom: 1px dashed #616a6b
.vh
border-bottom: 1px dashed #616a6b
pre
background-color: #2d3035
border: 1px solid #99a9bf
.vcontent.expand:before
background: linear-gradient(180deg,hsla(0, 0%, 0%, 0),hsl(218, 8%, 19%))
.vcontent.expand:after
background: hsla(204, 5%, 22%, 1)
.recent-post-item .article-title
color: #99a9bf
@@ -126,7 +146,8 @@ if hexo-config("nightshift") && hexo-config("nightshift.enable")
.translate_chn_to_cht,
.nightshift,
#readmode
#readmode,
#to_comment
background-color: #2d3035 !important
img
@@ -199,8 +220,6 @@ if hexo-config("nightshift") && hexo-config("nightshift.enable")
&::-webkit-scrollbar-thumb
background: lighten(#2d3035,5)
.more
background-color: #616a6b
#post_bottom
background: #2d3035
@@ -223,6 +242,12 @@ if hexo-config("nightshift") && hexo-config("nightshift.enable")
#page-header
.menus
background: #2d3035
.headline
color: #99a9bf !important
.length_num
color: darken(#99a9bf,10) !important
a
color: #99a9bf !important
.menu-icon-first,

18
source/css/_layout/page.styl
View File

@@ -104,24 +104,6 @@ galleryItemStyle(w, h)
time
color: $grey
.more_setting
display: none
.more
display: inline-block
padding: 0 1rem
height: h = 1.6rem
// background: $light-blue
// color: $white
text-align: center
text-decoration: none
line-height: h
cursor: pointer
// transition: all 0.2s ease-in-out
// &:hover
// background: $ruby
.article-title
margin-bottom: 0.3rem

145
source/css/_layout/post.styl
View File

@@ -1,3 +1,18 @@
if hexo-config("post_beautify.enable")
headStyle(fontsize)
padding-left: unit(fontsize + 0.3, "rem")
code
font-size: unit(fontsize, "rem")
&:before
top: calc(50% - unit(fontsize / 2 - 0.05, "rem"))
font-size: unit(fontsize, "rem")
&:hover
padding-left: unit(fontsize + 0.2, "rem")
#post-title
font-size: 1.4rem
@@ -100,22 +115,130 @@
#post-content
margin-bottom: 1rem
ol,
ul
margin-top: 0.4rem
counter-reset: li
if hexo-config("post_beautify.enable")
h1,
h2,
h3,
h4,
h5,
h6
cursor: pointer
transition: all 0.2s ease-out
p
margin: 0
&:before
position: absolute
top: calc(50% - 0.35rem)
left: 0
color: $title-prefix-icon-color
content: $title-prefix-icon
font: normal normal normal 14px / 1 FontAwesome
font-size: 0.8rem
transition: all 0.2s ease-out
&:hover
padding-left: 1.1rem
&:before
color: $light-blue
h1
headStyle(1)
h2
headStyle(0.9)
h3
headStyle(0.8)
h4
headStyle(0.7)
h5
headStyle(0.6)
h6
headStyle(0.6)
ol,
ul
padding-left: 0.5rem
margin-top: 0.4rem
padding: 0 0 0 0.8rem
list-style: none
counter-reset: li
li
position: relative
margin: 0.3rem 0
padding-left: 0.3rem
p
margin: 0
ol,
ul
padding-left: 0.5rem
li
position: relative
margin: 0.2rem 0
padding: 0.1rem 0.5rem 0.1rem 1.5rem
&:hover
&:before
transform: rotate(360deg)
&:before
position: absolute
top: 0
left: 0
background: $light-blue
color: $white
cursor: pointer
transition: all 0.3s ease-out
ol
> li
&:before
margin-top: 0.2rem
width: w = 1.2rem
height: h = w
border-radius: 0.5 * w
content: counter(li)
counter-increment: li
text-align: center
font-size: 0.6rem
line-height: h
ul
> li
&:hover
&:before
border-color: $ruby
&:before
$w = 0.3rem
top: 10px
margin-left: 0.45rem
width: w = $w
height: h = w
border: 0.5 * w solid $light-blue
border-radius: w
background: $white
content: ""
line-height: h
else
ol,
ul
margin-top: 0.4rem
counter-reset: li
p
margin: 0
ol,
ul
padding-left: 0.5rem
li
position: relative
margin: 0.3rem 0
padding-left: 0.3rem
a
color: $a-link-color

2
source/css/_layout/post_bottom.styl
View File

@@ -12,7 +12,7 @@
&.toc_mobile_show
bottom: 0
#to_comment,#mobile_toc
#mobile_to_comment,#mobile_toc
width: 50%
text-align: center
font-size: 18px

72
source/css/_layout/z-other.styl
View File

@@ -71,53 +71,6 @@ a.article-meta__categories
overflow: hidden
height: 90px
.more {
position: relative
letter-spacing: 1.2px
text-transform: uppercase
overflow: hidden
z-index: 1
background-color: $light-blue
&:focus {
outline: none
}
}
.more--primary {
color: $white
}
.more--animated {
transition-property: color
transition-duration: 0.5s
&:before {
content: ""
position: absolute
top: 0
left: 0
right: 0
bottom: 0
background: $ruby
transform: scaleX(0)
transform-origin: 0 50%
transition-property: transform
transition-duration: 0.5s
transition-timing-function: ease-out
z-index: -1
}
&:hover {
color: white
&:before {
transform: scaleX(1)
transition-timing-function: cubic-bezier(0.45, 1.64, 0.47, 0.66)
}
}
}
.layout_page
display: flex
margin: 0 auto
@@ -221,9 +174,6 @@ a.article-meta__categories
#recent-posts #pagination
margin-bottom: 0
.more_setting
display: block !important
#nav #site-social-icons
display: block
@@ -337,25 +287,3 @@ footer
50%{transform:scale(1)}
80%{transform:scale(.98)}
100%{transform:scale(1)}}
@keyframes menu_open{
0% {
transform: scale(0)
}
100% {
transform: scale(1)
}
}
@keyframes menu_close{
0% {
transform: scale(1)
display: block
}
100% {
transform: scale(0)
display: none
}
}