mirror of
https://github.com/jerryc127/hexo-theme-butterfly.git
synced 2025-09-15 12:58:48 +08:00
1. 可設置隱藏文章 2. 適配 Hexo 的 Tag Plugins Code Block With marked lines 顯示 3. 可配置首頁cover顯示的位置 4. 更改深色模式下的配色 5. activate_power_mode 增加關閉顏色和抖動 6. 增加谷歌廣告,騰訊分析 7. 相關文章增加時間顯示,調整佈局,垂直居中 8. 文章頁面,top_img增加評論數顯示 9. 可以取消點擊圖片觀看大圖 10. mathjax和kathex可設置每頁都加載還是按需加載 11. 深色模式下,滾動條顔色的適配 12. 優化gitalk 在 dark mode下的顯示 13. 文章頁,文章標題過長時,只顯示三行內容 14. 深色模式下,背景圖片加上蒙板 15. 優化深色/閲讀模式下,canvas的顯示 16. 優化打賞的特效和移動到二維碼不會立刻消失 17. 優化sub-menu樣式 18. 修改aside 的tags顔色,在深色模式下不會出現觀看困難 19. 升級 normalize.css 到最新版 20. 優化手機上toc和menu的打開動畫 21. 優化代碼框打開關閉的特效 22. 精簡js,部分操作改為css控制 23. 優化主題的一些動畫,不會過於生硬 1. 修復當圖片被a標簽包圍時,點擊圖標沒有跳轉到對應網頁而是出現大圖觀看模式的bug 2. 修復當網址有subdirectory時,menu、打賞二維碼和lodding_bg 鏈接路徑錯誤的bug 3. 修復當網址有subdirectory時, 4. 修復katex 的 CSS無法讀取bug 5. 修復搜索按鈕在文章頁不顯示的bug 6. 修復gitalk css引用失敗的bug 7. 修復 點擊特效 煙花 無效的bug 8. 修復gitalk報path.startsWith is not a function的bug 9. 修復 閲讀模式下,背景沒有變純色的bug 10. 修復閲讀模式下,header 偶爾出現沒有靠攏頂部的bug 11. 修復Hexo Tag Plugins Block Quote 裏的鏈接顯示出外面的Bug 12. 修復aside歸檔日期過長導致錯位的bug 13. 修復toc為空時,toc按鈕仍存在的bug 14. 修復關閉懶加載後,頭像無法顯示的bug 15. 修復深色模式下,切換readmode偶爾會無效的bug 16. 修復在一些手機設備上,toc和menu的按鈕顯示不對齊的bug #72
379 lines
5.7 KiB
Stylus
379 lines
5.7 KiB
Stylus
html
|
|
height: 100%
|
|
font-size: $rem
|
|
|
|
body
|
|
position: relative
|
|
min-height: 100%
|
|
background: $white
|
|
color: $font-black
|
|
font-size: $font-size
|
|
font-family: $font-family
|
|
line-height: $text-line-height
|
|
|
|
if !hexo-config('copy.enable')
|
|
user-select: none
|
|
-moz-user-select: none
|
|
-webkit-user-select: none
|
|
-ms-user-select: none
|
|
|
|
#body-wrap
|
|
position: relative
|
|
display: flex
|
|
flex: 1 auto
|
|
flex-direction: column
|
|
transition: all .5s
|
|
|
|
*::-webkit-scrollbar
|
|
width: 8px
|
|
height: 8px
|
|
|
|
*::-webkit-scrollbar-thumb
|
|
background: $light-blue
|
|
|
|
*::-webkit-scrollbar-track
|
|
background-color: transparent
|
|
|
|
#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: lighten($font-color, 15%)
|
|
font-weight: bold
|
|
|
|
code
|
|
font-size: inherit !important
|
|
|
|
#content-outer
|
|
flex: 1 auto
|
|
|
|
*
|
|
box-sizing: border-box
|
|
|
|
#toggle-sidebar
|
|
position: fixed
|
|
bottom: $sidebar-icon-top
|
|
left: $sidebar-icon-left
|
|
z-index: 100
|
|
font-size: $sidebar-icon-size
|
|
opacity: 0
|
|
cursor: pointer
|
|
transition: all .2s
|
|
|
|
hr
|
|
position: relative
|
|
margin: 2rem auto
|
|
width: calc(100% - 4px)
|
|
border: 2px dashed $pale-blue
|
|
background: $white
|
|
|
|
&:hover
|
|
&:before
|
|
left: calc(95% - 20px)
|
|
|
|
&:before
|
|
position: absolute
|
|
top: $hr-icon-top
|
|
left: 5%
|
|
z-index: 1
|
|
color: $light-blue
|
|
content: $hr-icon
|
|
font: normal normal normal 14px / 1 FontAwesome
|
|
font-size: 20px
|
|
transition: all 1s ease-in-out
|
|
|
|
iframe
|
|
margin: 0 0 1rem
|
|
|
|
// collapse/expand beautify
|
|
details
|
|
padding: .3rem
|
|
border: 2px solid darken($light-grey, 10%)
|
|
|
|
summary
|
|
color: $theme-color
|
|
|
|
// set <caption> of <figure> to center-align
|
|
// use class="not-code" to avoid conflicts because code also use <figure> tag
|
|
.not-code
|
|
margin: .5em
|
|
padding: .5em
|
|
border: thin silver solid
|
|
text-align: center
|
|
|
|
table
|
|
overflow: auto
|
|
margin: 0 0 1rem
|
|
width: 100%
|
|
border-spacing: 0
|
|
border-collapse: collapse
|
|
|
|
thead
|
|
background: alpha($a-link-color, 10%)
|
|
|
|
th,
|
|
td
|
|
padding: .3rem .6rem
|
|
border: 1px solid darken($light-grey, 10%)
|
|
vertical-align: top
|
|
|
|
*::selection
|
|
background: $selection
|
|
color: $pale-grey
|
|
|
|
// 字體
|
|
.full_page #site-title,
|
|
.full_page #site-sub-title,
|
|
#site-name,
|
|
#aside_content .author-info__name,
|
|
#aside_content .author-info__description
|
|
font-family: $site-name-font
|
|
|
|
.is_right
|
|
text-align: right
|
|
|
|
.is_left
|
|
text-align: left
|
|
|
|
.is-center
|
|
text-align: center
|
|
|
|
.is_visible
|
|
display: block !important
|
|
|
|
.is_invisible
|
|
display: none !important
|
|
|
|
.is_hidden
|
|
overflow: hidden
|
|
|
|
.pull_left
|
|
float: left
|
|
|
|
.pull_right
|
|
float: right
|
|
|
|
// button hover
|
|
.button--primary
|
|
color: $ruby
|
|
|
|
.button--animated
|
|
transition-duration: 1s
|
|
transition-property: color
|
|
|
|
&:before
|
|
position: absolute
|
|
top: 0
|
|
right: 0
|
|
bottom: 0
|
|
left: 0
|
|
z-index: -1
|
|
background: $ruby
|
|
content: ''
|
|
transition-timing-function: ease-out
|
|
transition-duration: .5s
|
|
transition-property: transform
|
|
transform: scaleX(0)
|
|
transform-origin: 0 50%
|
|
|
|
&:hover
|
|
&:before
|
|
transition-timing-function: cubic-bezier(.45, 1.64, .47, .66)
|
|
transform: scaleX(1)
|
|
|
|
// third-party
|
|
.fireworks
|
|
position: fixed
|
|
z-index: -1
|
|
z-index: 99999
|
|
pointer-events: none
|
|
|
|
img[src=''],
|
|
img:not([src])
|
|
opacity: 0
|
|
|
|
.justified-gallery
|
|
margin: 1rem 0
|
|
|
|
img
|
|
opacity: 0
|
|
|
|
.fancybox
|
|
width: auto
|
|
text-align: inherit
|
|
|
|
.img-alt
|
|
display: none
|
|
|
|
.medium-zoom-image--opened
|
|
z-index: 99999 !important
|
|
margin: 0 !important
|
|
|
|
.medium-zoom-overlay
|
|
z-index: 99999 !important
|
|
|
|
// hexo tag video
|
|
.video-container
|
|
position: relative
|
|
overflow: hidden
|
|
margin-bottom: .8rem
|
|
padding-top: 56.25%
|
|
height: 0
|
|
|
|
iframe
|
|
position: absolute
|
|
top: 0
|
|
left: 0
|
|
margin-top: 0
|
|
width: 100%
|
|
height: 100%
|
|
|
|
.layout_page,
|
|
.layout_post,
|
|
#footer
|
|
animation: main 1s
|
|
|
|
#nav,
|
|
#top-container
|
|
animation: header 1s
|
|
|
|
#site-title
|
|
animation: titlescale 1s
|
|
|
|
canvas,
|
|
#web_bg
|
|
animation: 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
|
|
|
|
@keyframes scroll-down-effect
|
|
0%
|
|
top: 0
|
|
opacity: .4
|
|
|
|
50%
|
|
top: -16px
|
|
opacity: 1
|
|
|
|
100%
|
|
top: 0
|
|
opacity: .4
|
|
|
|
@keyframes header
|
|
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 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)
|
|
|
|
@media screen and (max-width: $bg)
|
|
i#toggle-sidebar,
|
|
#sidebar
|
|
display: none
|
|
|
|
body
|
|
padding-left: 0 !important
|