mirror of
https://github.com/jerryc127/hexo-theme-butterfly.git
synced 2025-09-15 12:58:48 +08:00
c512a5fda5
2. feat: 可隱藏Mobile sidebar 子菜單 3. refactor: archives和card-post 改為flex佈局 4. feat: 當寬度小於1024時，點擊toc滾動，增加滾動效果 5. feat: 點擊滾動，如果滾動是向上時，將會偏移60px， 避免導航欄遮擋 close #317 6. feat: 可配置font-size 7. refactor: 去除字體放大、縮小按鈕 8. refactor: 部分css由'px'改為'em'，適應font-size值改變而改變 9. feat: pjax增加exclude配置 10. fix: 修復canvas_nest 配置沒有生效的Bugs 11. feat: 新增 cnzz_analytics 12. feat: 騰訊分析改為騰訊移動分析，並適配pjax 13. perf: 改cookies為localstore存儲 14. feat: 設置中的theme_color可單獨配置幾個，而不需要全部開啟 close #314 15. feat: butterfly.yml 採用deepMerge, 與_config文件進行合併而不是替換 16. fix: 修復rightsize-bottom配置無效的bug 17. refactor: aside增加position sticky 18. refactor: 調整webinfo 寬度小時的顯示 19. feat: 更改addtoany item的寫法 20. refactor: aside 內容邊距調整 21. feat: 增加最後更新時間顯示
358 lines
5.5 KiB
Stylus
358 lines
5.5 KiB
Stylus
html
|
|
height: 100%
|
|
font-size: 20px
|
|
|
|
body
|
|
position: relative
|
|
min-height: 100%
|
|
background: var(--global-bg)
|
|
color: var(--font-color)
|
|
font-size: $font-size
|
|
font-family: $font-family
|
|
line-height: $text-line-height
|
|
-webkit-tap-highlight-color: rgba(0, 0, 0, 0)
|
|
|
|
if !hexo-config('copy.enable')
|
|
user-select: none
|
|
|
|
*::-webkit-scrollbar
|
|
width: 8px
|
|
height: 8px
|
|
|
|
*::-webkit-scrollbar-thumb
|
|
background: var(--btn-bg)
|
|
|
|
*::-webkit-scrollbar-track
|
|
background-color: transparent
|
|
|
|
input::placeholder
|
|
color: var(--font-color)
|
|
|
|
#web_bg
|
|
position: fixed
|
|
z-index: -999
|
|
width: 100%
|
|
height: 100%
|
|
background: $web-bg
|
|
background-attachment: local
|
|
background-position: center
|
|
background-size: cover
|
|
background-repeat: no-repeat
|
|
|
|
h1,
|
|
h2,
|
|
h3,
|
|
h4,
|
|
h5,
|
|
h6
|
|
position: relative
|
|
margin: 1rem 0 .7rem
|
|
color: var(--text-highlight-color)
|
|
font-weight: bold
|
|
|
|
code
|
|
font-size: inherit !important
|
|
|
|
*
|
|
box-sizing: border-box
|
|
|
|
hr
|
|
position: relative
|
|
margin: 2rem auto
|
|
border: 2px dashed var(--hr-border)
|
|
|
|
if hexo-config('hr_icon.enable')
|
|
width: calc(100% - 4px)
|
|
|
|
&:hover
|
|
&:before
|
|
left: calc(95% - 20px)
|
|
|
|
&:before
|
|
position: absolute
|
|
top: $hr-icon-top
|
|
left: 5%
|
|
z-index: 1
|
|
color: var(--hr-before-color)
|
|
content: $hr-icon
|
|
font-size: 20px
|
|
line-height: 1
|
|
transition: all 1s ease-in-out
|
|
@extend .fontawesomeIcon
|
|
|
|
.table-wrap
|
|
overflow-x: scroll
|
|
margin: 0 0 1rem
|
|
|
|
table
|
|
display: table
|
|
width: 100%
|
|
border-spacing: 0
|
|
border-collapse: collapse
|
|
empty-cells: show
|
|
|
|
thead
|
|
background: alpha($table-thead-bg, 10%)
|
|
|
|
th,
|
|
td
|
|
padding: .3rem .6rem
|
|
border: 1px solid var(--light-grey)
|
|
vertical-align: middle
|
|
|
|
*::selection
|
|
background: $theme-text-selection-color
|
|
color: #F7F7F7
|
|
|
|
button
|
|
padding: 0
|
|
outline: 0
|
|
border: none
|
|
background: none
|
|
cursor: pointer
|
|
|
|
// font
|
|
#page-header #site_title,
|
|
#page-header #site_subtitle,
|
|
#site-name,
|
|
#aside_content .author-info__name,
|
|
#aside_content .author-info__description
|
|
font-family: $site-name-font
|
|
|
|
.is-center
|
|
text-align: center
|
|
|
|
.copy-true
|
|
user-select: all
|
|
|
|
.pull-left
|
|
float: left
|
|
|
|
.pull-right
|
|
float: right
|
|
|
|
.button--animated
|
|
position: relative
|
|
z-index: 1
|
|
transition: color 1s
|
|
|
|
&:before
|
|
position: absolute
|
|
top: 0
|
|
right: 0
|
|
bottom: 0
|
|
left: 0
|
|
z-index: -1
|
|
background: var(--btn-hover-color)
|
|
content: ''
|
|
transition: transform .5s ease-out
|
|
transform: scaleX(0)
|
|
transform-origin: 0 50%
|
|
|
|
&:hover
|
|
&:before
|
|
transition-timing-function: cubic-bezier(.45, 1.64, .47, .66)
|
|
transform: scaleX(1)
|
|
|
|
img[src=''],
|
|
img:not([src])
|
|
opacity: 0
|
|
|
|
.img-alt
|
|
margin: -.5rem 0 .5rem
|
|
color: #858585
|
|
|
|
&:hover
|
|
text-decoration: none !important
|
|
|
|
.post-ad
|
|
margin: 2rem 0
|
|
|
|
.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) |