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

fix: 修復上個版本導致的代碼塊部分css沒有生成的bugs

Browse Source 
fix: 修復valine背景圖片再次出現時，由左到右移動的bugs
improvement: 調大sidebar的寬度
improvement: html結構調整，mobile-sidebar改為sidebar/search調整
remove: 刪除多餘的css和pug
This commit is contained in:
Jerry
2020-10-20 21:05:58 +08:00
Unverified
parent 71b15d86c1
commit c54f23bc14
28 changed files with 364 additions and 361 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
source/css/_global/function.styl
View File

@@ -68,7 +68,7 @@ if hexo-config('enter_transitions')
#ribbon-canvas
animation: ribbon_to_show 4s
#mobile-sidebar-menus
#sidebar-menus
&.open
for i in 1 2 3 4
> :nth-child({i})

1
source/css/_global/index.styl
View File

@@ -25,7 +25,6 @@
--blockquote-color: $blockquote-color
--blockquote-bg: $blockquote-background-color
--reward-pop: $reward-pop-up-bg
--sidebar-icon-color: $sidebar-icon-color
--toc-link-color: $toc-link-color
html

6
source/css/_highlight/highlight.styl
View File

@@ -1,8 +1,8 @@
// https://github.com/equinusocio/vsc-material-theme
$highlight_theme = hexo-config('highlight_theme')
$highlighEnable = hexo-config('rootConfig.highlight') && hexo-config('rootConfig.highlight.enable')
$prismjsEnable = hexo-config('rootConfig.prismjs') && hexo-config('rootConfig.prismjs.enable')
wordWrap = !hexo-config('rootConfig.highlight.line_number') && hexo-config('code_word_wrap')
$highlighEnable = hexo-config('highlight_settings') && hexo-config('highlight_settings.enable')
$prismjsEnable = hexo-config('prismjs_settings') && hexo-config('prismjs_settings.enable')
wordWrap = !hexo-config('highlight_settings.line_number') && hexo-config('code_word_wrap')
@require 'theme'

6
source/css/_highlight/highlight/index.styl
View File

@@ -22,9 +22,9 @@ if $highlight_theme != false
overflow: auto
border: none
td
padding: 0
border: none
td
padding: 0
border: none
.gutter pre
padding-right: .5rem

2
source/css/_highlight/prismjs/index.styl
View File

@@ -1,4 +1,4 @@
if hexo-fonfig('rootConfig.prismjs.line_number')
if hexo-fonfig('prismjs_settings.line_number')
@require 'line-number'
if $highlight_theme != false

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

@@ -65,7 +65,7 @@
color: var(--font-color)
font-size: 1em
.length_num
.length-num
margin-top: -.3rem
color: var(--text-highlight-color)
font-size: 1.4em
@@ -271,7 +271,7 @@
bottom: 30px
z-index: 100
display: none
width: 300px
width: $toc-mobile-width
transform-origin: right bottom
animation: toc-open .3s
@@ -303,7 +303,7 @@
&.active
border-left-color: darken($theme-toc-color, 20%)
background: $theme-toc-color
color: $sidebar-active-color
color: $toc-active-color
&:before
position: absolute

24
source/css/_layout/mobile-sidebar.styl → source/css/_layout/sidebar.styl
View File

@@ -1,5 +1,5 @@
#mobile-sidebar
#menu_mask
#sidebar
#menu-mask
position: fixed
z-index: 102
display: none
@@ -7,14 +7,14 @@
height: 100%
background: alpha($dark-black, .8)
#mobile-sidebar-menus
#sidebar-menus
position: fixed
top: 0
right: -250px
right: -($sidebar-width)
z-index: 103
overflow-x: hidden
overflow-y: auto
width: 250px
width: $sidebar-width
height: 100%
background: var(--sidebar-bg)
transition: all .5s
@@ -22,7 +22,7 @@
&.open
transform: translate3d(-100%, 0, 0)
& > .mobile_author_icon
& > .author-avatar
padding: 1.3rem 1.5rem 0
text-align: center
@@ -35,20 +35,20 @@
&:hover
transform: rotate(360deg)
.mobile_post_data
.site-data
display: table
padding: .6rem .5rem 0
width: 100%
table-layout: fixed
.mobile_data_item
.data-item
display: table-cell
.mobile_data_link
.data-item-link
& > a > div
@extend .limit-one-line
.length_num
.length-num
color: var(--text-highlight-color)
font-size: 1.28em
@@ -71,11 +71,11 @@
cursor: pointer
i:first-child
width: 30%
width: 25%
text-align: left
span
width: 70%
width: 75%
&:hover
color: $light-blue

2
source/css/_layout/third-party.styl
View File

@@ -14,7 +14,7 @@
background: url(hexo-config('valine.bg')) 100% 100% no-repeat
&:focus
background: none
background-image: none
.vimg
transition: all .3s

3
source/css/_mode/darkmode.styl
View File

@@ -26,7 +26,6 @@ if hexo-config('darkmode.enable') || hexo-config('display_mode') == 'dark'
--blockquote-color: alpha(#FFFFFF, .7)
--blockquote-bg: lighten(#121212, 10)
--reward-pop: lighten(#121212, 10)
--sidebar-icon-color: alpha(#FFFFFF, .7)
--toc-link-color: alpha(#FFFFFF, .6)
#web_bg:before,
@@ -69,7 +68,7 @@ if hexo-config('darkmode.enable') || hexo-config('display_mode') == 'dark'
figure.highlight
box-shadow: none
if hexo-config('rootConfig.highlight') && hexo-config('rootConfig.highlight.enable')
if hexo-config('highlight_settings') && hexo-config('highlight_settings.enable')
table::-webkit-scrollbar-thumb
background: lighten(#121212, 5)

127
source/css/_search/algolia.styl
View File

@@ -1,76 +1,77 @@
#algolia-search
animation: titlescale .5s
.search-dialog
animation: titlescale .5s
.ais-search-box
margin: 0 auto
max-width: 100%
width: 100%
.ais-search-box
margin: 0 auto
max-width: 100%
width: 100%
input
padding: .25rem .7rem
outline: none
border: 2px solid $search-color
border-radius: 2rem
background: var(--search-bg)
color: var(--search-input-color)
input
padding: .25rem .7rem
outline: none
border: 2px solid $search-color
border-radius: 2rem
background: var(--search-bg)
color: var(--search-input-color)
.ais-hits--item.algolia-hit-item
position: relative
padding-left: 1.2rem
&:hover
&:before
border-color: $pseudo-hover
&:before
$w = .5em
position: absolute
top: .53em
left: 0
width: w = $w
height: h = w
border: .15rem solid $search-color
border-radius: w
background: transparent
content: ''
line-height: h
transition: all .2s ease-in-out
a
display: block
color: var(--search-result-title)
cursor: pointer
.ais-hits--item.algolia-hit-item
position: relative
padding-left: 1.2rem
&:hover
color: $search-color
&:before
border-color: $pseudo-hover
em
color: $search-keyword-highlight
font-weight: bold
&:before
$w = .5em
position: absolute
top: .53em
left: 0
width: w = $w
height: h = w
border: .15rem solid $search-color
border-radius: w
background: transparent
content: ''
line-height: h
transition: all .2s ease-in-out
.ais-pagination.pagination
margin: .8rem 0 0
padding: 0
text-align: center
a
display: block
color: var(--search-result-title)
cursor: pointer
.ais-pagination--item
margin: 0 .2rem
&:hover
color: $search-color
em
color: $search-keyword-highlight
font-weight: bold
.ais-pagination.pagination
margin: .8rem 0 0
padding: 0
text-align: center
a
display: inline-block
min-width: 1.2rem
height: 1.2rem
text-align: center
line-height: 1.2rem
.ais-pagination--item
margin: 0 .2rem
padding: 0
.ais-pagination--item.current
a
background: $theme-paginator-color
color: #eee
cursor: default
a
display: inline-block
min-width: 1.2rem
height: 1.2rem
text-align: center
line-height: 1.2rem
.algolia-logo
padding-top: 2px
width: 4rem
height: 1.5rem
.ais-pagination--item.current
a
background: $theme-paginator-color
color: #eee
cursor: default
.algolia-logo
padding-top: 2px
width: 4rem
height: 1.5rem

113
source/css/_search/local-search.styl
View File

@@ -1,68 +1,69 @@
#local-search
animation: titlescale .5s
.search-dialog
animation: titlescale .5s
.local-search-box
margin: 0 auto
max-width: 100%
width: 100%
input
padding: .25rem .7rem
.local-search-box
margin: 0 auto
max-width: 100%
width: 100%
outline: none
border: 2px solid $search-color
border-radius: 2rem
background: var(--search-bg)
color: var(--search-input-color)
-webkit-appearance: none
.local-search__hit-item
position: relative
padding-left: 1.2rem
line-height: 1.7
input
padding: .25rem .7rem
width: 100%
outline: none
border: 2px solid $search-color
border-radius: 2rem
background: var(--search-bg)
color: var(--search-input-color)
-webkit-appearance: none
&:hover
&:before
border-color: $pseudo-hover
&:before
$w = .5em
position: absolute
top: .45em
left: 0
width: w = $w
height: h = w
border: .15rem solid $search-color
border-radius: w
background: transparent
content: ''
line-height: h
transition: all .2s ease-in-out
a
display: block
color: var(--search-result-title)
font-weight: 600
cursor: pointer
.local-search__hit-item
position: relative
padding-left: 1.2rem
line-height: 1.7
&:hover
color: $search-color
&:before
border-color: $pseudo-hover
.search-result
margin: 0 0 .4rem
word-break: break-all
&:before
$w = .5em
position: absolute
top: .45em
left: 0
width: w = $w
height: h = w
border: .15rem solid $search-color
border-radius: w
background: transparent
content: ''
line-height: h
transition: all .2s ease-in-out
.search-keyword
color: $search-keyword-highlight
font-weight: bold
a
display: block
color: var(--search-result-title)
font-weight: 600
cursor: pointer
.local-search-stats__hr
display: none !important
&:hover
color: $search-color
.search-result-list
overflow-y: auto
max-height: 10.5rem
.search-result
margin: 0 0 .4rem
word-break: break-all
+maxWidth768()
padding-bottom: 2rem
max-height: 75vh !important
.search-keyword
color: $search-keyword-highlight
font-weight: bold
.local-search-stats__hr
display: none !important
.search-result-list
overflow-y: auto
max-height: 10.5rem
+maxWidth768()
padding-bottom: 2rem
max-height: 75vh !important

10
source/css/var.styl
View File

@@ -58,16 +58,12 @@ $a-link-color = #99a9bf
$sticky-color = $light-orange
$theme-meta-color = $themeColorEnable && hexo-config('theme_color.meta_color') ? convert(hexo-config('theme_color.meta_color')) : #858585
// sidebar
$sidebar-icon-top = 20px
$sidebar-icon-left = $sidebar-icon-top - 4px
$sidebar-icon-size = 16px
$sidebar-icon-color = #1F2D3D
$sidebar-width = 300px
$sidebar-background = #f6f8fa
$sidebar-active-color = #fff
$mobile-sidebar-width = 250px
$sidebar-width = 300px
// aside
$toc-link-color = #666261
$toc-mobile-width = 300px
$toc-active-color = #fff
// Button
$button-color = #fff
$button-hover-color = $themeColorEnable && hexo-config('theme_color.button_hover') ? convert(hexo-config('theme_color.button_hover')) : $light-orange