mirror of
https://github.com/jerryc127/hexo-theme-butterfly.git
synced 2026-04-12 14:07:06 +08:00
pjax
This commit is contained in:
Jerry
@@ -16,3 +16,31 @@
|
||||
font-family: 'Font Awesome 5 Free'
|
||||
text-rendering: auto
|
||||
-webkit-font-smoothing: antialiased
|
||||
|
||||
[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
|
||||
@@ -5,8 +5,8 @@ html
|
||||
body
|
||||
position: relative
|
||||
min-height: 100%
|
||||
background: $body-bg
|
||||
color: $font-black
|
||||
background: var(--global-bg)
|
||||
color: var(--font-color)
|
||||
font-size: $font-size
|
||||
font-family: $font-family
|
||||
line-height: $text-line-height
|
||||
@@ -20,11 +20,14 @@ body
|
||||
height: 8px
|
||||
|
||||
*::-webkit-scrollbar-thumb
|
||||
background: $light-blue
|
||||
background: var(--btn-bg)
|
||||
|
||||
*::-webkit-scrollbar-track
|
||||
background-color: transparent
|
||||
|
||||
input::placeholder
|
||||
color: var(--font-color)
|
||||
|
||||
#web_bg
|
||||
position: fixed
|
||||
z-index: -999
|
||||
@@ -44,7 +47,7 @@ h5,
|
||||
h6
|
||||
position: relative
|
||||
margin: 1rem 0 .7rem
|
||||
color: lighten($font-color, 15%)
|
||||
color: var(--text-highlight-color)
|
||||
font-weight: bold
|
||||
|
||||
code
|
||||
@@ -53,19 +56,10 @@ h6
|
||||
*
|
||||
box-sizing: border-box
|
||||
|
||||
#toggle-sidebar
|
||||
position: fixed
|
||||
bottom: $sidebar-icon-top
|
||||
left: $sidebar-icon-left
|
||||
z-index: 100
|
||||
font-size: $sidebar-icon-size
|
||||
cursor: pointer
|
||||
transition: all .2s
|
||||
|
||||
hr
|
||||
position: relative
|
||||
margin: 2rem auto
|
||||
border: 2px dashed lighten($theme-hr-color, 50%)
|
||||
border: 2px dashed var(--hr-border)
|
||||
|
||||
if hexo-config('hr_icon.enable')
|
||||
width: calc(100% - 4px)
|
||||
@@ -79,7 +73,7 @@ hr
|
||||
top: $hr-icon-top
|
||||
left: 5%
|
||||
z-index: 1
|
||||
color: lighten($theme-hr-color, 30%)
|
||||
color: var(--hr-before-color)
|
||||
content: $hr-icon
|
||||
font-size: 20px
|
||||
line-height: 1
|
||||
@@ -103,7 +97,7 @@ table
|
||||
th,
|
||||
td
|
||||
padding: .3rem .6rem
|
||||
border: 1px solid darken($light-grey, 10%)
|
||||
border: 1px solid var(--light-grey)
|
||||
vertical-align: middle
|
||||
|
||||
*::selection
|
||||
@@ -157,8 +151,9 @@ button
|
||||
float: right
|
||||
|
||||
.button--animated
|
||||
transition-duration: 1s
|
||||
transition-property: color
|
||||
position: relative
|
||||
z-index: 1
|
||||
transition: color 1s
|
||||
|
||||
&:before
|
||||
position: absolute
|
||||
@@ -167,11 +162,9 @@ button
|
||||
bottom: 0
|
||||
left: 0
|
||||
z-index: -1
|
||||
background: $theme-button-hover-color
|
||||
background: var(--btn-hover-color)
|
||||
content: ''
|
||||
transition-timing-function: ease-out
|
||||
transition-duration: .5s
|
||||
transition-property: transform
|
||||
transition: transform .5s ease-out
|
||||
transform: scaleX(0)
|
||||
transform-origin: 0 50%
|
||||
|
||||
@@ -186,7 +179,7 @@ img:not([src])
|
||||
|
||||
.img-alt
|
||||
margin: -.5rem 0 .5rem
|
||||
color: $font-black
|
||||
color: #858585
|
||||
|
||||
&:hover
|
||||
text-decoration: none !important
|
||||
@@ -373,4 +366,4 @@ if hexo-config('avatar.effect') == true
|
||||
transform: translateX(-200px)
|
||||
|
||||
100%
|
||||
transform: translateX(0)
|
||||
transform: translateX(0)
|
||||
@@ -1,73 +1,78 @@
|
||||
// For diff highlight
|
||||
pre .deletion
|
||||
color: $highlight-deletion
|
||||
figure.highlight
|
||||
table
|
||||
&::-webkit-scrollbar-thumb
|
||||
background: $highlight-scrollbar
|
||||
|
||||
pre .deletion
|
||||
color: $highlight-deletion
|
||||
|
||||
pre .addition
|
||||
color: $highlight-addition
|
||||
pre .addition
|
||||
color: $highlight-addition
|
||||
|
||||
pre .meta
|
||||
color: $highlight-purple
|
||||
|
||||
pre
|
||||
.comment
|
||||
color: $highlight-comment
|
||||
|
||||
.variable,
|
||||
.attribute,
|
||||
.regexp,
|
||||
.ruby .constant,
|
||||
.xml .tag .title,
|
||||
.xml .pi,
|
||||
.xml .doctype,
|
||||
.html .doctype,
|
||||
.css .id,
|
||||
.tag .name,
|
||||
.css .class,
|
||||
.css .pseudo
|
||||
color: $highlight-red
|
||||
|
||||
.tag
|
||||
color: $highlight-aqua
|
||||
|
||||
.number,
|
||||
.preprocessor,
|
||||
.literal,
|
||||
.params,
|
||||
.constant,
|
||||
.command
|
||||
color: $highlight-orange
|
||||
|
||||
.built_in
|
||||
color: $highlight-yellow
|
||||
|
||||
.ruby .class .title,
|
||||
.css .rules .attribute,
|
||||
.string,
|
||||
.value,
|
||||
.inheritance,
|
||||
.header,
|
||||
.ruby .symbol,
|
||||
.xml .cdata,
|
||||
.special,
|
||||
.number,
|
||||
.formula
|
||||
color: $highlight-green
|
||||
|
||||
.keyword,
|
||||
.title,
|
||||
.css .hexcolor
|
||||
color: $highlight-aqua
|
||||
|
||||
.function,
|
||||
.python .decorator,
|
||||
.python .title,
|
||||
.ruby .function .title,
|
||||
.ruby .title .keyword,
|
||||
.perl .sub,
|
||||
.javascript .title,
|
||||
.coffeescript .title
|
||||
color: $highlight-blue
|
||||
|
||||
.tag .attr,
|
||||
.javascript .function
|
||||
pre .meta
|
||||
color: $highlight-purple
|
||||
|
||||
pre
|
||||
.comment
|
||||
color: $highlight-comment
|
||||
|
||||
.variable,
|
||||
.attribute,
|
||||
.regexp,
|
||||
.ruby .constant,
|
||||
.xml .tag .title,
|
||||
.xml .pi,
|
||||
.xml .doctype,
|
||||
.html .doctype,
|
||||
.css .id,
|
||||
.tag .name,
|
||||
.css .class,
|
||||
.css .pseudo
|
||||
color: $highlight-red
|
||||
|
||||
.tag
|
||||
color: $highlight-aqua
|
||||
|
||||
.number,
|
||||
.preprocessor,
|
||||
.literal,
|
||||
.params,
|
||||
.constant,
|
||||
.command
|
||||
color: $highlight-orange
|
||||
|
||||
.built_in
|
||||
color: $highlight-yellow
|
||||
|
||||
.ruby .class .title,
|
||||
.css .rules .attribute,
|
||||
.string,
|
||||
.value,
|
||||
.inheritance,
|
||||
.header,
|
||||
.ruby .symbol,
|
||||
.xml .cdata,
|
||||
.special,
|
||||
.number,
|
||||
.formula
|
||||
color: $highlight-green
|
||||
|
||||
.keyword,
|
||||
.title,
|
||||
.css .hexcolor
|
||||
color: $highlight-aqua
|
||||
|
||||
.function,
|
||||
.python .decorator,
|
||||
.python .title,
|
||||
.ruby .function .title,
|
||||
.ruby .title .keyword,
|
||||
.perl .sub,
|
||||
.javascript .title,
|
||||
.coffeescript .title
|
||||
color: $highlight-blue
|
||||
|
||||
.tag .attr,
|
||||
.javascript .function
|
||||
color: $highlight-purple
|
||||
|
||||
@@ -24,8 +24,8 @@ blockquote
|
||||
margin: 0 0 1rem
|
||||
padding: .1rem .8rem
|
||||
border-left: .2rem solid $blockquote-padding-color
|
||||
background-color: $blockquote-background-color
|
||||
color: $blockquote-color
|
||||
background-color: var(--blockquote-bg)
|
||||
color: var(--blockquote-color)
|
||||
|
||||
a
|
||||
word-break: break-all
|
||||
@@ -135,17 +135,16 @@ blockquote
|
||||
color: $highlight-tools.color
|
||||
font-size: 14px
|
||||
|
||||
.code-expand
|
||||
.expand
|
||||
position: absolute
|
||||
padding: .4rem .7rem
|
||||
cursor: pointer
|
||||
transition: all .3s
|
||||
transform: rotate(0)
|
||||
transition: transform .3s
|
||||
|
||||
& + .code-lang
|
||||
left: 1.7rem
|
||||
|
||||
&.code-closed
|
||||
&.closed
|
||||
transition: all .3s
|
||||
transform: rotate(-90deg) !important
|
||||
|
||||
@@ -182,7 +181,7 @@ blockquote
|
||||
td
|
||||
border: none
|
||||
|
||||
if $highlight_theme == 'mac' || $highlight_theme == 'mac light'
|
||||
if $highlight_theme == 'mac' || ($highlight_theme == 'mac light')
|
||||
figure.highlight
|
||||
margin: 0 0 1.2rem
|
||||
border-radius: 7px
|
||||
@@ -201,10 +200,10 @@ blockquote
|
||||
box-shadow: 20px 0 #fdbc40, 40px 0 #35cd4b
|
||||
content: ' '
|
||||
|
||||
.code-expand
|
||||
.expand
|
||||
right: 0
|
||||
|
||||
&.code-closed
|
||||
&.closed
|
||||
transition: all .3s
|
||||
transform: rotate(90deg) !important
|
||||
|
||||
|
||||
@@ -23,6 +23,7 @@ if $highlight_theme == 'default'
|
||||
color: alpha($highlight-foreground, .8),
|
||||
bg-color: darken($highlight-background, 2)
|
||||
}
|
||||
$highlight-scrollbar = darken($highlight-background, 6)
|
||||
|
||||
if $highlight_theme == 'darker' || $highlight_theme == 'mac'
|
||||
$highlight-background = #212121
|
||||
@@ -48,6 +49,7 @@ if $highlight_theme == 'darker' || $highlight_theme == 'mac'
|
||||
color: alpha($highlight-foreground, .8),
|
||||
bg-color: darken($highlight-background, 2)
|
||||
}
|
||||
$highlight-scrollbar = darken($highlight-background, 6)
|
||||
|
||||
if $highlight_theme == 'pale night'
|
||||
$highlight-background = #292D3E
|
||||
@@ -72,6 +74,7 @@ if $highlight_theme == 'pale night'
|
||||
color: $highlight-foreground,
|
||||
bg-color: darken($highlight-background, 2)
|
||||
}
|
||||
$highlight-scrollbar = darken($highlight-background, 6)
|
||||
|
||||
if $highlight_theme == 'ocean'
|
||||
$highlight-background = #0F111A
|
||||
@@ -96,6 +99,7 @@ if $highlight_theme == 'ocean'
|
||||
color: $highlight-foreground,
|
||||
bg-color: darken($highlight-background, 2)
|
||||
}
|
||||
$highlight-scrollbar = darken($highlight-background, 5)
|
||||
|
||||
if $highlight_theme == 'light' || $highlight_theme == 'mac light'
|
||||
$highlight-background = #F6F8FA
|
||||
@@ -121,6 +125,8 @@ if $highlight_theme == 'light' || $highlight_theme == 'mac light'
|
||||
color: $highlight-foreground,
|
||||
bg-color: darken($highlight-background, 5)
|
||||
}
|
||||
$highlight-scrollbar = darken($highlight-background, 8)
|
||||
|
||||
|
||||
if $highlight_theme == false
|
||||
$highlight-background = #F6F8FA
|
||||
|
||||
@@ -17,7 +17,7 @@ if hexo-config('error_404.enable')
|
||||
margin: 0 1rem
|
||||
height: 18rem
|
||||
border-radius: 8px
|
||||
background: #fff
|
||||
background: var(--card-bg)
|
||||
box-shadow: 0 4px 8px 6px rgba(7, 17, 27, .06)
|
||||
|
||||
@media screen and (max-width: 768px)
|
||||
@@ -30,7 +30,7 @@ if hexo-config('error_404.enable')
|
||||
height: 100%
|
||||
border-top-left-radius: 8px
|
||||
border-bottom-left-radius: 8px
|
||||
background-color: #49b1f5
|
||||
background-color: $theme-color
|
||||
background-position: center
|
||||
background-size: cover
|
||||
|
||||
@@ -53,7 +53,6 @@ if hexo-config('error_404.enable')
|
||||
|
||||
.error_title
|
||||
margin-top: -4rem
|
||||
color: $font-color
|
||||
font-size: 9em
|
||||
|
||||
@media screen and (max-width: 768px)
|
||||
@@ -62,19 +61,16 @@ if hexo-config('error_404.enable')
|
||||
.error_subtitle
|
||||
@extend .limit-more-line
|
||||
margin-top: -3.5rem
|
||||
color: $font-color
|
||||
word-break: break-word
|
||||
font-size: 1.6em
|
||||
-webkit-line-clamp: 2
|
||||
|
||||
a
|
||||
position: relative
|
||||
z-index: 1
|
||||
display: inline-block
|
||||
margin-top: .5rem
|
||||
padding: .3rem 1.5rem
|
||||
background: $theme-color
|
||||
color: white
|
||||
background: var(--btn-bg)
|
||||
color: var(--btn-color)
|
||||
|
||||
i
|
||||
padding-right: .3rem
|
||||
|
||||
@@ -7,7 +7,7 @@
|
||||
.card-widget
|
||||
overflow: hidden
|
||||
border-radius: 8px
|
||||
background: $card-bg
|
||||
background: var(--card-bg)
|
||||
box-shadow: 0 4px 8px 6px rgba(7, 17, 27, .06)
|
||||
transition: all .3s
|
||||
|
||||
@@ -44,12 +44,12 @@
|
||||
a
|
||||
.headline
|
||||
@extend .limit-one-line
|
||||
color: $font-black
|
||||
color: var(--font-color)
|
||||
font-size: .7rem
|
||||
|
||||
.length_num
|
||||
margin-top: -.3rem
|
||||
color: $dark-black
|
||||
color: var(--text-highlight-color)
|
||||
font-size: 1rem
|
||||
|
||||
.card-info-social-icons
|
||||
@@ -57,7 +57,7 @@
|
||||
|
||||
.social-icon
|
||||
margin: 0 .5rem
|
||||
color: $font-black
|
||||
color: var(--font-color)
|
||||
font-size: 1rem
|
||||
cursor: pointer
|
||||
|
||||
@@ -67,13 +67,11 @@
|
||||
&:hover
|
||||
transform: rotate(540deg)
|
||||
|
||||
#bookmark-it
|
||||
position: relative
|
||||
z-index: 1
|
||||
#card-info-btn
|
||||
display: block
|
||||
width: 100%
|
||||
background-color: $light-blue
|
||||
color: $button-color
|
||||
background-color: var(--btn-bg)
|
||||
color: var(--btn-color)
|
||||
text-align: center
|
||||
line-height: 1.6rem
|
||||
|
||||
span
|
||||
@@ -94,7 +92,7 @@
|
||||
padding: 0 .1rem
|
||||
|
||||
&:hover
|
||||
color: $light-blue !important
|
||||
color: $text-hover !important
|
||||
|
||||
.card-recent-post
|
||||
.aside-recent-item
|
||||
@@ -103,46 +101,44 @@
|
||||
& > .aside-recent-post
|
||||
margin-bottom: 10px
|
||||
|
||||
& > a
|
||||
color: $font-black
|
||||
.aside-post-cover
|
||||
float: left
|
||||
overflow: hidden
|
||||
width: 66px
|
||||
height: 66px
|
||||
|
||||
.aside-post-cover
|
||||
float: left
|
||||
overflow: hidden
|
||||
width: 66px
|
||||
height: 66px
|
||||
.aside-post-bg
|
||||
padding: 0
|
||||
max-width: 100%
|
||||
width: 100%
|
||||
height: 100%
|
||||
transition: all .6s
|
||||
object-fit: cover
|
||||
|
||||
.aside-post-bg
|
||||
padding: 0
|
||||
max-width: 100%
|
||||
width: 100%
|
||||
height: 100%
|
||||
transition: all .6s
|
||||
object-fit: cover
|
||||
&:hover
|
||||
box-shadow: none
|
||||
transform: scale(1.1)
|
||||
|
||||
&:hover
|
||||
box-shadow: none
|
||||
transform: scale(1.1)
|
||||
.aside-post-info
|
||||
.aside-post_meta
|
||||
padding-left: 10px
|
||||
color: $theme-meta-color
|
||||
font-size: .6rem
|
||||
|
||||
.aside-post-title
|
||||
.aside-post_meta
|
||||
padding-left: 10px
|
||||
color: $theme-meta-color
|
||||
font-size: .6rem
|
||||
@extend .limit-more-line
|
||||
padding-left: 10px
|
||||
height: 40px
|
||||
color: var(--font-color)
|
||||
line-height: 1rem
|
||||
-webkit-line-clamp: 2
|
||||
|
||||
.aside-post_title
|
||||
@extend .limit-more-line
|
||||
padding-left: 10px
|
||||
height: 40px
|
||||
line-height: 1rem
|
||||
-webkit-line-clamp: 2
|
||||
&:hover
|
||||
color: $text-hover
|
||||
|
||||
&:hover
|
||||
color: $light-blue !important
|
||||
|
||||
&.no-aside-cover
|
||||
.aside-post_title
|
||||
height: auto
|
||||
&.no-aside-cover
|
||||
.aside-post-title
|
||||
height: auto
|
||||
|
||||
.card-archives ul.card-archive-list,
|
||||
.card-categories ul.card-category-list
|
||||
@@ -156,12 +152,12 @@
|
||||
display: inline-block
|
||||
padding: .15rem 1rem
|
||||
width: 100%
|
||||
color: $font-black
|
||||
color: var(--font-color)
|
||||
transition: all .4s
|
||||
|
||||
&:hover
|
||||
padding: .15rem .85rem
|
||||
background-color: $light-blue
|
||||
background-color: var(--text-bg-hover)
|
||||
|
||||
span
|
||||
@extend .limit-one-line
|
||||
|
||||
@@ -1,15 +1,10 @@
|
||||
.category-content
|
||||
ol,
|
||||
ul
|
||||
margin-top: .4rem
|
||||
padding: 0 0 0 .8rem
|
||||
list-style: none
|
||||
counter-reset: li
|
||||
|
||||
p
|
||||
margin: 0
|
||||
|
||||
ol,
|
||||
ul
|
||||
padding-left: .5rem
|
||||
|
||||
@@ -18,39 +13,11 @@
|
||||
margin: .3rem 0
|
||||
padding: .1rem .5rem .1rem 1.5rem !important
|
||||
|
||||
&:hover
|
||||
&:before
|
||||
transform: rotate(360deg)
|
||||
|
||||
&:before
|
||||
position: absolute
|
||||
top: 0
|
||||
left: 0
|
||||
background: $light-blue
|
||||
color: $card-bg
|
||||
cursor: pointer
|
||||
transition: all .3s ease-out
|
||||
|
||||
ol
|
||||
li
|
||||
&:before
|
||||
margin-top: .2rem
|
||||
width: w = 1.2rem
|
||||
height: h = w
|
||||
border-radius: .5 * w
|
||||
content: counter(li)
|
||||
counter-increment: li
|
||||
text-align: center
|
||||
font-size: .6rem
|
||||
line-height: h
|
||||
|
||||
ul
|
||||
li
|
||||
&:hover
|
||||
&:before
|
||||
border-color: $theme-button-hover-color
|
||||
|
||||
&:before
|
||||
$w = .3rem
|
||||
top: 10px
|
||||
margin-left: .45rem
|
||||
|
||||
@@ -70,5 +70,5 @@
|
||||
transition: .4s
|
||||
|
||||
.comment-wrap
|
||||
.comments-items-2
|
||||
> div:nth-child(2)
|
||||
display: none
|
||||
@@ -11,12 +11,12 @@
|
||||
position: relative
|
||||
float: left
|
||||
overflow: hidden
|
||||
margin: 20px 7px
|
||||
margin: 15px 7px
|
||||
width: calc(100% / 3 - 15px)
|
||||
height: 90px
|
||||
border-radius: 8px
|
||||
line-height: 17px
|
||||
transform: perspective(1px) translateZ(0)
|
||||
-webkit-transform: translateZ(0)
|
||||
|
||||
@media screen and (max-width: 1100px)
|
||||
width: calc(50% - 15px) !important
|
||||
@@ -35,11 +35,9 @@
|
||||
bottom: 0
|
||||
left: 0
|
||||
z-index: -1
|
||||
background: $light-blue
|
||||
background: var(--text-bg-hover)
|
||||
content: ''
|
||||
transition-timing-function: ease-out
|
||||
transition-duration: .3s
|
||||
transition-property: transform
|
||||
transition: transform .3s ease-out
|
||||
transform: scale(0)
|
||||
|
||||
&:hover:before,
|
||||
@@ -48,14 +46,14 @@
|
||||
transform: scale(1)
|
||||
|
||||
a
|
||||
color: $font-color
|
||||
color: var(--font-color)
|
||||
text-decoration: none
|
||||
|
||||
img
|
||||
float: left
|
||||
margin: 13px 0 0 10px
|
||||
width: 65px
|
||||
height: 65px
|
||||
margin: 15px 10px
|
||||
width: 60px
|
||||
height: 60px
|
||||
border-radius: 35px
|
||||
transition: all .3s
|
||||
|
||||
@@ -64,6 +62,7 @@
|
||||
|
||||
.flink-item-name
|
||||
@extend .limit-one-line
|
||||
display: block
|
||||
padding: 16px 10px 0 0
|
||||
height: 40px
|
||||
font-weight: bold
|
||||
@@ -71,6 +70,7 @@
|
||||
|
||||
.flink-item-desc
|
||||
@extend .limit-one-line
|
||||
padding: 16px 10px
|
||||
display: block
|
||||
padding: 16px 10px 16px 0
|
||||
height: 50px
|
||||
font-size: 13px
|
||||
|
||||
@@ -16,11 +16,11 @@
|
||||
#footer-wrap
|
||||
position: relative
|
||||
padding: 2rem 1rem
|
||||
color: $light-grey
|
||||
color: var(--light-grey)
|
||||
text-align: center
|
||||
|
||||
a
|
||||
color: $light-grey
|
||||
color: var(--light-grey)
|
||||
cursor: pointer
|
||||
|
||||
&:hover
|
||||
|
||||
@@ -22,27 +22,37 @@
|
||||
#site_title,
|
||||
#site_subtitle,
|
||||
#scroll_down .scroll-down-effects
|
||||
color: $light-grey
|
||||
text-align: center
|
||||
text-shadow: .1rem .1rem .2rem rgba(0, 0, 0, .15)
|
||||
line-height: 1.5
|
||||
|
||||
#site_title
|
||||
margin: 0
|
||||
color: var(--white)
|
||||
font-size: 1.3rem
|
||||
|
||||
@media screen and (min-width: $sm)
|
||||
font-size: 2rem
|
||||
|
||||
#site_subtitle
|
||||
color: var(--light-grey)
|
||||
font-size: .8rem
|
||||
|
||||
@media screen and (min-width: $sm)
|
||||
font-size: 1.2rem
|
||||
|
||||
#site_social_icons
|
||||
display: none
|
||||
margin: 0 auto
|
||||
width: 15rem
|
||||
text-align: center
|
||||
|
||||
@media screen and (max-width: $sm)
|
||||
display: block
|
||||
|
||||
.social-icon
|
||||
margin: 0 .5rem
|
||||
color: $light-grey
|
||||
color: var(--light-grey)
|
||||
text-shadow: .1rem .1rem .2rem rgba(0, 0, 0, .15)
|
||||
font-size: 1rem
|
||||
cursor: pointer
|
||||
@@ -56,22 +66,32 @@
|
||||
.scroll-down-effects
|
||||
position: relative
|
||||
width: 100%
|
||||
color: var(--light-grey)
|
||||
font-size: 30px
|
||||
|
||||
// page
|
||||
&.not-index-bg
|
||||
height: 20rem
|
||||
|
||||
@media screen and (max-width: $sm)
|
||||
height: 14rem
|
||||
|
||||
#page_site-info
|
||||
position: absolute
|
||||
top: 10rem
|
||||
padding: 0 .5rem
|
||||
width: 100%
|
||||
|
||||
@media screen and (max-width: $sm)
|
||||
top: 7rem
|
||||
|
||||
// post
|
||||
&.post-bg
|
||||
height: 20rem
|
||||
|
||||
@media screen and (max-width: $sm)
|
||||
height: 18rem
|
||||
|
||||
&:before
|
||||
position: absolute
|
||||
top: 0
|
||||
@@ -87,43 +107,60 @@
|
||||
bottom: 1.5rem
|
||||
padding: 0 8%
|
||||
width: 100%
|
||||
color: $light-grey
|
||||
text-align: left
|
||||
|
||||
@media screen and (max-width: $sm)
|
||||
bottom: 1.1rem
|
||||
padding: 0 1.1rem
|
||||
|
||||
#post-title
|
||||
margin-bottom: .4rem
|
||||
font-size: 1.5rem
|
||||
|
||||
@media screen and (max-width: $sm)
|
||||
font-size: 1.2rem
|
||||
|
||||
.posttitle
|
||||
@extend .limit-more-line
|
||||
color: var(--white)
|
||||
line-height: 1.5
|
||||
-webkit-line-clamp: 3
|
||||
|
||||
#post-meta
|
||||
color: var(--light-grey)
|
||||
font-size: 95%
|
||||
|
||||
> .meta-secondline,
|
||||
> .meta-thirdline
|
||||
display: inline
|
||||
@media screen and (min-width: $sm)
|
||||
> .meta-secondline
|
||||
> span:first-child
|
||||
display: none
|
||||
|
||||
.word-count,
|
||||
#busuanzi_value_page_pv,
|
||||
.comment-count
|
||||
padding-left: .2rem
|
||||
@media screen and (max-width: $sm)
|
||||
font-size: 90%
|
||||
|
||||
> .meta-firstline,
|
||||
> .meta-secondline
|
||||
display: inline
|
||||
|
||||
.post-meta
|
||||
&__separator
|
||||
margin: 0 .3rem
|
||||
&-separator
|
||||
margin: 0 .25rem
|
||||
|
||||
&__icon
|
||||
&-icon
|
||||
margin-right: .2rem
|
||||
|
||||
&-label
|
||||
if hexo-config('post_meta.post.label')
|
||||
margin-right: .2rem
|
||||
else
|
||||
display: none
|
||||
|
||||
a
|
||||
color: $light-grey
|
||||
color: var(--light-grey)
|
||||
transition: all .3s ease-out
|
||||
|
||||
&:hover
|
||||
color: $light-blue
|
||||
color: $text-hover
|
||||
text-decoration: underline
|
||||
|
||||
// css hack
|
||||
@@ -145,6 +182,9 @@ _:future,
|
||||
opacity: 0
|
||||
transition: all .5s
|
||||
|
||||
@media screen and (max-width: $sm)
|
||||
padding: 10px .8rem
|
||||
|
||||
&:not(.fixed)
|
||||
.menus
|
||||
padding-right: 0 !important
|
||||
@@ -155,30 +195,30 @@ _:future,
|
||||
vertical-align: top
|
||||
|
||||
&:hover
|
||||
color: $white
|
||||
color: var(--white)
|
||||
|
||||
&.is-visible-inline
|
||||
.site-page
|
||||
font-size: inherit
|
||||
|
||||
a
|
||||
color: $light-grey
|
||||
color: var(--light-grey)
|
||||
|
||||
&:hover
|
||||
color: $white
|
||||
color: var(--white)
|
||||
|
||||
&.fixed
|
||||
position: fixed
|
||||
top: -60px
|
||||
z-index: 91
|
||||
background: alpha($white, .8)
|
||||
background: rgba(255, 255, 255, .8)
|
||||
box-shadow: 0 5px 6px -5px alpha($grey, .6)
|
||||
transition: transform .2s ease-in-out, opacity .2s ease-in-out
|
||||
|
||||
a,
|
||||
#site-name,
|
||||
.toggle-menu
|
||||
color: $font-black
|
||||
color: var(--font-color)
|
||||
text-shadow: none
|
||||
|
||||
&:hover
|
||||
@@ -188,9 +228,6 @@ _:future,
|
||||
transition: all .5s
|
||||
transform: translate3d(0, 100%, 0)
|
||||
|
||||
.menus_item_child
|
||||
background-color: $white !important
|
||||
|
||||
#site-name
|
||||
text-shadow: .1rem .1rem .2rem rgba($dark-black, .15)
|
||||
font-weight: bold
|
||||
@@ -208,13 +245,12 @@ _:future,
|
||||
.menus_item_child
|
||||
display: block
|
||||
|
||||
.menus-expand
|
||||
i.expand
|
||||
transform: rotate(180deg) !important
|
||||
|
||||
.menus-expand
|
||||
i.expand
|
||||
padding: 4px
|
||||
transition: all .3s
|
||||
transform: rotate(0)
|
||||
transition: transform .3s
|
||||
|
||||
& > a
|
||||
&:after
|
||||
@@ -239,7 +275,7 @@ _:future,
|
||||
margin-top: 8px
|
||||
padding: 0
|
||||
width: max-content
|
||||
background-color: alpha($white, .8)
|
||||
background-color: var(--sidebar-bg)
|
||||
box-shadow: 0 5px 20px -4px rgba($dark-black, .5)
|
||||
animation: sub_menus .3s .1s ease both
|
||||
|
||||
@@ -255,13 +291,13 @@ _:future,
|
||||
list-style: none
|
||||
|
||||
&:hover
|
||||
background: $theme-color
|
||||
background: var(--text-bg-hover)
|
||||
|
||||
a
|
||||
display: inline-block
|
||||
padding: .3rem .7rem
|
||||
width: 100%
|
||||
color: $font-black
|
||||
color: var(--font-color)
|
||||
text-shadow: none
|
||||
|
||||
#search_button
|
||||
@@ -273,54 +309,4 @@ _:future,
|
||||
padding-bottom: .3rem
|
||||
text-shadow: .05rem .05rem .1rem rgba($dark-black, .3)
|
||||
font-size: .7rem
|
||||
cursor: pointer
|
||||
|
||||
@media screen and (min-width: $sm)
|
||||
#page-header
|
||||
#site_title
|
||||
font-size: 2rem
|
||||
|
||||
#site_subtitle
|
||||
font-size: 1.2rem
|
||||
|
||||
@media screen and (max-width: $sm)
|
||||
#nav
|
||||
padding: 10px .8rem
|
||||
|
||||
#page-header
|
||||
#site_social_icons
|
||||
display: block
|
||||
|
||||
&.not-index-bg
|
||||
height: 14rem
|
||||
|
||||
#page_site-info
|
||||
top: 7rem
|
||||
|
||||
&.post-bg
|
||||
height: 18rem
|
||||
|
||||
& > #post-info
|
||||
bottom: 1rem
|
||||
padding: 0 5%
|
||||
|
||||
& > #post-title
|
||||
font-size: 1.2rem
|
||||
|
||||
& > #post-meta
|
||||
font-size: 90%
|
||||
|
||||
.post-meta__categories
|
||||
display: none
|
||||
|
||||
.meta-thirdline
|
||||
display: block
|
||||
|
||||
.post-meta-pv-cv
|
||||
.post-meta__separator:first-child
|
||||
display: none
|
||||
|
||||
if !hexo-config('busuanzi.page_pv')
|
||||
.post-meta-commentcount
|
||||
.post-meta__separator
|
||||
display: none
|
||||
cursor: pointer
|
||||
@@ -1,18 +1,18 @@
|
||||
if hexo-config('preloader')
|
||||
loading-bg()
|
||||
.loading-bg
|
||||
position: fixed
|
||||
z-index: 1000
|
||||
width: 50%
|
||||
height: 100%
|
||||
background-color: $preloader-bg
|
||||
background-color: var(--preloader-bg)
|
||||
transition: all .5s
|
||||
|
||||
#loading-box
|
||||
.loading-left-bg
|
||||
loading-bg()
|
||||
@extend .loading-bg
|
||||
|
||||
.loading-right-bg
|
||||
loading-bg()
|
||||
@extend .loading-bg
|
||||
right: 0
|
||||
|
||||
.spinner-box
|
||||
@@ -43,13 +43,13 @@ if hexo-config('preloader')
|
||||
|
||||
.loading-word
|
||||
position: absolute
|
||||
color: $white
|
||||
color: var(--preloader-color)
|
||||
font-size: .8rem
|
||||
|
||||
.configure-core
|
||||
width: 100%
|
||||
height: 100%
|
||||
background-color: $preloader-bg
|
||||
background-color: var(--preloader-bg)
|
||||
|
||||
&.loaded
|
||||
.loading-left-bg
|
||||
|
||||
@@ -16,7 +16,7 @@
|
||||
overflow-y: auto
|
||||
width: 250px
|
||||
height: 100%
|
||||
background: #f6f8fa
|
||||
background: var(--sidebar-bg)
|
||||
transition: all .5s
|
||||
|
||||
& > .mobile_author_icon
|
||||
@@ -46,12 +46,12 @@
|
||||
@extend .limit-one-line
|
||||
|
||||
.length_num
|
||||
color: $dark-black
|
||||
color: var(--text-highlight-color)
|
||||
font-size: .9rem
|
||||
|
||||
.headline
|
||||
display: block
|
||||
color: $font-black
|
||||
color: var(--font-color)
|
||||
font-size: .7rem
|
||||
|
||||
hr
|
||||
@@ -65,7 +65,7 @@
|
||||
position: relative
|
||||
display: block
|
||||
padding: .3rem 1.5rem
|
||||
color: $font-black
|
||||
color: var(--font-color)
|
||||
font-size: .8rem
|
||||
cursor: pointer
|
||||
|
||||
@@ -79,14 +79,13 @@
|
||||
&:hover
|
||||
color: $light-blue
|
||||
|
||||
.menus-expand
|
||||
.expand
|
||||
position: absolute
|
||||
right: 0
|
||||
padding: .4rem
|
||||
transition: all .3s
|
||||
transform: rotate(0)
|
||||
transition: transform .3s
|
||||
|
||||
&.menus-closed
|
||||
&.closed
|
||||
transform: rotate(90deg) !important
|
||||
|
||||
.menus_item_child
|
||||
|
||||
@@ -19,7 +19,7 @@
|
||||
padding: 0
|
||||
height: 280px
|
||||
border-radius: 8px
|
||||
background: $card-bg
|
||||
background: var(--card-bg)
|
||||
box-shadow: 0 4px 8px 6px rgba(7, 17, 27, .06)
|
||||
transition: all .3s
|
||||
|
||||
@@ -82,31 +82,34 @@
|
||||
& > .article-title
|
||||
@extend .limit-more-line
|
||||
margin-bottom: .3rem
|
||||
color: $font-black
|
||||
color: var(--text-highlight-color)
|
||||
font-size: 1.2rem
|
||||
line-height: 1.4
|
||||
transition: all .2s ease-in-out
|
||||
-webkit-line-clamp: 2
|
||||
|
||||
&:hover
|
||||
color: $light-blue !important
|
||||
color: $text-hover
|
||||
|
||||
& > .article-meta-wrap
|
||||
font-size: 85%
|
||||
color: $theme-meta-color
|
||||
font-size: 90%
|
||||
|
||||
& > time
|
||||
color: $theme-meta-color
|
||||
& > .post-meta-date
|
||||
cursor: default
|
||||
|
||||
& > .article-meta
|
||||
color: $theme-meta-color
|
||||
|
||||
.sticky
|
||||
color: $sticky-color
|
||||
|
||||
i
|
||||
margin: 0 .2rem 0 0
|
||||
|
||||
.article-meta-label
|
||||
if hexo-config('post_meta.page.label')
|
||||
padding-right: .2rem
|
||||
else
|
||||
display: none
|
||||
|
||||
.article-meta__separator
|
||||
margin: 0 .3rem
|
||||
|
||||
@@ -116,12 +119,11 @@
|
||||
.fa-angle-right
|
||||
margin: 0 .2rem
|
||||
|
||||
a.article-meta__categories,
|
||||
a.article-meta__tags
|
||||
a
|
||||
color: $theme-meta-color
|
||||
|
||||
&:hover
|
||||
color: $light-blue !important
|
||||
color: $text-hover
|
||||
text-decoration: underline
|
||||
|
||||
& > .content
|
||||
@@ -138,7 +140,7 @@
|
||||
transition: all .3s
|
||||
|
||||
&:hover
|
||||
color: $theme-button-hover-color !important
|
||||
color: $text-hover !important
|
||||
transform: scale(1.1)
|
||||
|
||||
&__title
|
||||
@@ -152,7 +154,7 @@
|
||||
.layout_page > div:first-child:not(.recent-posts)
|
||||
padding: 50px 40px
|
||||
border-radius: 8px
|
||||
background: $card-bg
|
||||
background: var(--card-bg)
|
||||
box-shadow: 0 4px 8px 6px rgba(7, 17, 27, .06)
|
||||
transition: all .3s
|
||||
|
||||
@@ -178,7 +180,7 @@
|
||||
|
||||
&:hover
|
||||
&:before
|
||||
border-color: $theme-button-hover-color
|
||||
border-color: $pseudo-hover
|
||||
|
||||
&:before
|
||||
position: absolute
|
||||
@@ -189,7 +191,7 @@
|
||||
height: h = w
|
||||
border: .5 * w solid $light-blue
|
||||
border-radius: w
|
||||
background: $card-bg
|
||||
background: var(--card-bg)
|
||||
content: ''
|
||||
line-height: h
|
||||
transition: all .2s ease-in-out
|
||||
@@ -213,7 +215,7 @@
|
||||
|
||||
&:hover
|
||||
&:before
|
||||
border-color: $theme-button-hover-color
|
||||
border-color: $pseudo-hover
|
||||
|
||||
&:before
|
||||
$w = .3rem
|
||||
@@ -224,7 +226,7 @@
|
||||
height: h = w
|
||||
border: .5 * w solid $light-blue
|
||||
border-radius: w
|
||||
background: $card-bg
|
||||
background: var(--card-bg)
|
||||
content: ''
|
||||
line-height: h
|
||||
transition: all .2s ease-in-out
|
||||
@@ -234,7 +236,7 @@
|
||||
flex-direction: column
|
||||
justify-content: center
|
||||
|
||||
.article-sort-post
|
||||
.article-sort-item-info
|
||||
padding: 0
|
||||
width: 100%
|
||||
|
||||
@@ -248,26 +250,34 @@
|
||||
|
||||
&:before
|
||||
top: .7rem
|
||||
border-color: $theme-button-hover-color
|
||||
border-color: $pseudo-hover
|
||||
|
||||
&__time
|
||||
padding-left: .4rem
|
||||
font-size: .7rem
|
||||
&-time
|
||||
color: $theme-meta-color
|
||||
font-size: .9em
|
||||
|
||||
&__title
|
||||
time
|
||||
padding-left: .4rem
|
||||
cursor: default
|
||||
|
||||
&-title
|
||||
@extend .limit-more-line
|
||||
color: $font-black
|
||||
font-size: .75rem
|
||||
color: var(--font-color)
|
||||
font-size: 1.1em
|
||||
transition: all .3s
|
||||
-webkit-line-clamp: 2
|
||||
|
||||
&:hover
|
||||
color: $light-blue !important
|
||||
color: $text-hover
|
||||
transform: translateX(20px)
|
||||
|
||||
&__img
|
||||
&-img
|
||||
float: left
|
||||
overflow: hidden
|
||||
width: 80px
|
||||
height: 80px
|
||||
|
||||
img
|
||||
padding: 0
|
||||
width: 100%
|
||||
height: 100%
|
||||
transition: all .6s
|
||||
@@ -276,22 +286,11 @@
|
||||
&:hover
|
||||
transform: scale(1.1)
|
||||
|
||||
&__post
|
||||
color: $theme-meta-color
|
||||
|
||||
&:hover
|
||||
color: $theme-meta-color
|
||||
|
||||
&-img
|
||||
float: left
|
||||
overflow: hidden
|
||||
width: 80px
|
||||
height: 80px
|
||||
|
||||
&-post
|
||||
display: inline-block
|
||||
padding: 0 1rem
|
||||
width: calc(100% - 80px)
|
||||
&-info
|
||||
display: inline-block
|
||||
overflow: hidden
|
||||
padding: 0 1rem
|
||||
width: calc(100% - 80px)
|
||||
|
||||
.category-lists
|
||||
padding: 1rem 0 1.5rem
|
||||
@@ -302,9 +301,12 @@
|
||||
|
||||
.category-list
|
||||
a
|
||||
color: $font-black
|
||||
color: var(--font-color)
|
||||
cursor: pointer
|
||||
|
||||
&:hover
|
||||
color: $text-hover
|
||||
|
||||
.category-list-count
|
||||
margin-left: .4rem
|
||||
color: $theme-meta-color
|
||||
|
||||
@@ -17,7 +17,7 @@
|
||||
|
||||
&.current
|
||||
background: $theme-paginator-color
|
||||
color: $button-color
|
||||
color: var(--white)
|
||||
cursor: default
|
||||
|
||||
img.prev-cover,
|
||||
@@ -39,7 +39,7 @@
|
||||
.prev_info,
|
||||
.next_info
|
||||
@extend .limit-one-line
|
||||
color: $button-color
|
||||
color: var(--white)
|
||||
font-weight: 500
|
||||
|
||||
.next-post
|
||||
@@ -51,7 +51,7 @@
|
||||
|
||||
.prev-post .label,
|
||||
.next-post .label
|
||||
color: alpha($white, .9)
|
||||
color: var(--light-grey)
|
||||
text-transform: uppercase
|
||||
font-size: 90%
|
||||
|
||||
|
||||
@@ -18,7 +18,6 @@ beautify()
|
||||
h4,
|
||||
h5,
|
||||
h6
|
||||
cursor: pointer
|
||||
transition: all .2s ease-out
|
||||
|
||||
&:before
|
||||
@@ -81,7 +80,7 @@ beautify()
|
||||
top: 0
|
||||
left: 0
|
||||
background: $light-blue
|
||||
color: $card-bg
|
||||
color: $white
|
||||
cursor: pointer
|
||||
transition: all .3s ease-out
|
||||
|
||||
@@ -102,7 +101,7 @@ beautify()
|
||||
> li:not(.tab)
|
||||
&:hover
|
||||
&:before
|
||||
border-color: $theme-button-hover-color
|
||||
border-color: $pseudo-hover
|
||||
|
||||
&:before
|
||||
$w = .3rem
|
||||
@@ -202,7 +201,7 @@ img
|
||||
|
||||
&:hover
|
||||
background: $light-blue
|
||||
color: $button-color
|
||||
color: var(--white)
|
||||
|
||||
.post_share
|
||||
display: inline-block
|
||||
@@ -224,7 +223,7 @@ img
|
||||
position: relative
|
||||
margin: 2rem 0 .5rem
|
||||
padding: .5rem .8rem
|
||||
border: 1px solid $light-grey
|
||||
border: 1px solid var(--light-grey)
|
||||
transition: box-shadow .3s ease-in-out
|
||||
|
||||
&:before
|
||||
@@ -244,7 +243,7 @@ img
|
||||
width: w = .4rem
|
||||
height: w
|
||||
border-radius: w
|
||||
background: $white
|
||||
background: var(--card-bg)
|
||||
content: ''
|
||||
|
||||
&:hover
|
||||
|
||||
@@ -41,13 +41,13 @@
|
||||
top: 50%
|
||||
padding: 0 1rem
|
||||
width: 100%
|
||||
color: $white
|
||||
transform: translate(0, -50%)
|
||||
|
||||
.relatedPosts_date
|
||||
color: $light-grey
|
||||
color: var(--light-grey)
|
||||
font-size: 90%
|
||||
|
||||
.relatedPosts_title
|
||||
@extend .limit-more-line
|
||||
-webkit-line-clamp: 2
|
||||
color: var(--white)
|
||||
|
||||
@@ -5,13 +5,15 @@
|
||||
text-align: center
|
||||
|
||||
.reward-button
|
||||
padding: .5rem 1.2rem
|
||||
background: $light-blue
|
||||
color: $button-color
|
||||
display: inline-block
|
||||
padding: .2rem 1.2rem
|
||||
background: var(--btn-bg)
|
||||
color: var(--btn-color)
|
||||
cursor: pointer
|
||||
transition: all .4s
|
||||
|
||||
&:hover
|
||||
box-shadow: inset 9em 0 0 0 $theme-button-hover-color
|
||||
box-shadow: inset 9em 0 0 0 var(--btn-hover-color)
|
||||
|
||||
.reward-main
|
||||
display: block
|
||||
@@ -30,7 +32,7 @@
|
||||
margin: 0
|
||||
padding: 1rem .5rem
|
||||
border-radius: 4px
|
||||
background: $reward-pop-up-bg
|
||||
background: var(--reward-pop)
|
||||
|
||||
&:before
|
||||
position: absolute
|
||||
@@ -48,7 +50,7 @@
|
||||
margin: 0 auto
|
||||
width: 0
|
||||
height: 0
|
||||
border-top: 13px solid $reward-pop-up-bg
|
||||
border-top: 13px solid var(--reward-pop)
|
||||
border-right: 13px solid transparent
|
||||
border-left: 13px solid transparent
|
||||
content: ''
|
||||
|
||||
@@ -7,14 +7,11 @@
|
||||
transition: all .5s
|
||||
|
||||
#rightside-config-hide
|
||||
transition: transform .4s
|
||||
transform: translate(35px, 0)
|
||||
|
||||
.rightside-in
|
||||
transform: translate(0, 0) !important
|
||||
animation: rightsideIn .3s
|
||||
|
||||
.rightside-out
|
||||
animation: rightsideOut .3s
|
||||
&.show
|
||||
transform: translate(0, 0) !important
|
||||
|
||||
& > div
|
||||
& > button,
|
||||
@@ -23,14 +20,14 @@
|
||||
margin-bottom: 2px
|
||||
width: 30px
|
||||
height: 30px
|
||||
background-color: $light-blue
|
||||
color: $button-color
|
||||
background-color: var(--btn-bg)
|
||||
color: var(--btn-color)
|
||||
text-align: center
|
||||
font-size: 16px
|
||||
cursor: pointer
|
||||
|
||||
&:hover
|
||||
background-color: $theme-button-hover-color
|
||||
background-color: var(--btn-hover-color)
|
||||
|
||||
#rightside_config
|
||||
i
|
||||
@@ -41,17 +38,3 @@
|
||||
|
||||
@media screen and (max-width: $bg)
|
||||
display: block
|
||||
|
||||
@keyframes rightsideIn
|
||||
0%
|
||||
transform: translate(30px, 0)
|
||||
|
||||
100%
|
||||
transform: translate(0, 0)
|
||||
|
||||
@keyframes rightsideOut
|
||||
0%
|
||||
transform: translate(0, 0)
|
||||
|
||||
100%
|
||||
transform: translate(30px, 0)
|
||||
|
||||
@@ -1,3 +1,15 @@
|
||||
#toggle-sidebar
|
||||
position: fixed
|
||||
bottom: $sidebar-icon-top
|
||||
left: $sidebar-icon-left
|
||||
z-index: 100
|
||||
font-size: $sidebar-icon-size
|
||||
cursor: pointer
|
||||
transition: all .2s
|
||||
|
||||
@media screen and (max-width: $bg)
|
||||
display: none
|
||||
|
||||
#sidebar
|
||||
position: fixed
|
||||
top: 0
|
||||
@@ -6,10 +18,21 @@
|
||||
padding: 1rem 0 2rem .5rem
|
||||
width: $sidebar-width
|
||||
height: 100%
|
||||
background: $sidebar-background
|
||||
box-shadow: -.25rem 0 .25rem rgba($sidebar-background, .6) inset
|
||||
background: var(--sidebar-bg)
|
||||
opacity: .9
|
||||
|
||||
@media screen and (max-width: $bg)
|
||||
right: -($mobile-sidebar-width)
|
||||
left: auto
|
||||
z-index: 103
|
||||
width: $mobile-sidebar-width
|
||||
opacity: 1
|
||||
transition: all .4s
|
||||
box-shadow: none
|
||||
|
||||
.toc-child
|
||||
display: block !important
|
||||
|
||||
.sidebar-toc
|
||||
ol,
|
||||
li
|
||||
@@ -56,19 +79,4 @@
|
||||
&-bar
|
||||
width: 0
|
||||
height: 1px
|
||||
background: $theme-toc-color
|
||||
|
||||
@media screen and (max-width: $bg)
|
||||
i#toggle-sidebar
|
||||
display: none
|
||||
|
||||
#sidebar
|
||||
right: -($mobile-sidebar-width)
|
||||
left: auto
|
||||
z-index: 103
|
||||
width: $mobile-sidebar-width
|
||||
opacity: 1
|
||||
transition: all .4s
|
||||
|
||||
.toc-child
|
||||
display: block !important
|
||||
background: $theme-toc-color
|
||||
@@ -1,55 +1,19 @@
|
||||
if hexo-config('valine.enable')
|
||||
#vcomment
|
||||
button
|
||||
padding: .3rem .8rem
|
||||
border-color: $button-color
|
||||
background-color: $light-blue
|
||||
color: $button-color
|
||||
font-size: .7rem
|
||||
transition: all .3s
|
||||
#vcomment
|
||||
if hexo-config('valine.bg')
|
||||
textarea
|
||||
background: url(hexo-config('valine.bg')) 100% 100% no-repeat
|
||||
|
||||
&:hover
|
||||
background-color: $theme-button-hover-color
|
||||
.vimg
|
||||
transition: all .3s
|
||||
|
||||
if hexo-config('valine.bg')
|
||||
textarea
|
||||
background: url(hexo-config('valine.bg')) 100% 100% no-repeat
|
||||
&:hover
|
||||
transform: rotate(360deg)
|
||||
|
||||
.vimg
|
||||
transition: all .3s
|
||||
.vcards .vcard .vcontent.expand
|
||||
&:before,
|
||||
&:after
|
||||
z-index: 22
|
||||
|
||||
&:hover
|
||||
transform: rotate(360deg)
|
||||
|
||||
.vat
|
||||
padding: 0 .8rem
|
||||
border: 1px solid $light-blue
|
||||
border-radius: 5px
|
||||
color: $light-blue
|
||||
font-size: .7125rem
|
||||
transition: all .3s
|
||||
|
||||
&:hover
|
||||
background-color: $light-blue
|
||||
color: $button-color
|
||||
|
||||
if hexo-config('beautify.enable')
|
||||
#article-container
|
||||
.aplayer
|
||||
ol,
|
||||
ul
|
||||
margin: 0
|
||||
padding: 0
|
||||
|
||||
li
|
||||
margin: 0
|
||||
padding: 0 15px
|
||||
|
||||
&:before
|
||||
content: none
|
||||
|
||||
// third-party
|
||||
// fireworks
|
||||
.fireworks
|
||||
position: fixed
|
||||
top: 0
|
||||
@@ -83,9 +47,30 @@ if hexo-config('beautify.enable')
|
||||
margin: 0 0 .8em
|
||||
padding: .3rem 0 .8em
|
||||
|
||||
.has-jax
|
||||
overflow: auto
|
||||
// mathjax
|
||||
mjx-container[jax='CHTML'][display='true']
|
||||
overflow-x: auto
|
||||
overflow-y: hidden
|
||||
padding-bottom: .5rem
|
||||
outline: 0
|
||||
line-height: 2
|
||||
|
||||
.aplayer
|
||||
color: $font-black
|
||||
|
||||
#article-container
|
||||
.aplayer
|
||||
margin: 0 0 1rem
|
||||
margin: 0 0 1rem
|
||||
|
||||
if hexo-config('beautify.enable')
|
||||
ol,
|
||||
ul
|
||||
margin: 0
|
||||
padding: 0
|
||||
|
||||
li
|
||||
margin: 0
|
||||
padding: 0 15px
|
||||
|
||||
&:before
|
||||
content: none
|
||||
@@ -1,11 +1,31 @@
|
||||
if hexo-config('darkmode.enable') || hexo-config('display_mode') == 'dark'
|
||||
[data-theme='dark']
|
||||
body
|
||||
background-color: darken(#121212, 2)
|
||||
color: alpha(#FFFFFF, .6)
|
||||
|
||||
::-webkit-scrollbar-thumb
|
||||
background: lighten(#121212, 5)
|
||||
--global-bg: darken(#121212, 2)
|
||||
--font-color: alpha(#FFFFFF, .6)
|
||||
--hr-border: alpha(#FFFFFF, .3)
|
||||
--hr-before-color: alpha(#FFFFFF, .6)
|
||||
--search-bg: #121212
|
||||
--search-input-color: alpha(#FFFFFF, .6)
|
||||
--search-result-title: alpha(#FFFFFF, .8)
|
||||
--preloader-bg: darken(#121212, 2)
|
||||
--preloader-color: alpha(#FFFFFF, .6)
|
||||
--tab-border-color: #2c2c2c
|
||||
--tab-botton-bg: #2c2c2c
|
||||
--tab-botton-color: alpha(#FFFFFF, .6)
|
||||
--tab-button-hover-bg: lighten(#121212, 15)
|
||||
--tab-button-active-bg: #121212
|
||||
--card-bg: #121212
|
||||
--sidebar-bg: #121212
|
||||
--btn-hover-color: lighten(#121212, 40)
|
||||
--btn-color: alpha(#FFFFFF, .6)
|
||||
--btn-bg: lighten(#121212, 5)
|
||||
--text-bg-hover: lighten(#121212, 15)
|
||||
--light-grey: alpha(#FFFFFF, .6)
|
||||
--white: alpha(#FFFFFF, .8)
|
||||
--text-highlight-color: alpha(#FFFFFF, .8)
|
||||
--blockquote-color: alpha(#FFFFFF, .6)
|
||||
--blockquote-bg: lighten(#121212, 10)
|
||||
--reward-pop: lighten(#121212, 10)
|
||||
|
||||
// 網站背景，footer背景
|
||||
#web_bg[data-type=color],
|
||||
@@ -20,63 +40,29 @@ if hexo-config('darkmode.enable') || hexo-config('display_mode') == 'dark'
|
||||
background-color: alpha($dark-black, .7)
|
||||
content: ''
|
||||
|
||||
#page-header,
|
||||
.layout_post > #post,
|
||||
.layout_page > div:first-child:not(.recent-posts)
|
||||
#page-header
|
||||
background-color: #121212
|
||||
|
||||
#sidebar
|
||||
background: #121212
|
||||
box-shadow: -.25rem 0 .25rem #121212
|
||||
|
||||
#article-container code
|
||||
background: #2c2c2c
|
||||
|
||||
.recent-posts
|
||||
.recent-post-item
|
||||
background: #121212 !important
|
||||
|
||||
.article-title
|
||||
color: alpha(#FFFFFF, .8) !important
|
||||
|
||||
// 頭部
|
||||
#page-header
|
||||
&:before
|
||||
position: absolute
|
||||
top: 0
|
||||
right: 0
|
||||
bottom: 0
|
||||
left: 0
|
||||
display: block
|
||||
width: 100%
|
||||
height: 100%
|
||||
background-color: alpha($dark-black, .7)
|
||||
content: ''
|
||||
|
||||
& > #nav
|
||||
a
|
||||
color: alpha(#FFFFFF, .8) !important
|
||||
|
||||
&.fixed
|
||||
background: alpha(#121212, .8)
|
||||
box-shadow: 0 5px 6px -5px rgba(133, 133, 133, 0)
|
||||
|
||||
.toggle-menu,
|
||||
#site-name,
|
||||
a
|
||||
color: alpha(#FFFFFF, .8)
|
||||
|
||||
.menus_item_child
|
||||
background-color: lighten(#121212, 5) !important
|
||||
|
||||
li
|
||||
&:hover
|
||||
background: lighten(#121212, 20) !important
|
||||
|
||||
a
|
||||
color: alpha(#FFFFFF, .8)
|
||||
|
||||
#site_subtitle
|
||||
& > span
|
||||
color: alpha(#FFFFFF, .6)
|
||||
|
||||
// 代碼框
|
||||
#article-container
|
||||
pre,
|
||||
@@ -87,234 +73,43 @@ if hexo-config('darkmode.enable') || hexo-config('display_mode') == 'dark'
|
||||
figure.highlight
|
||||
box-shadow: none
|
||||
|
||||
table::-webkit-scrollbar-thumb
|
||||
background: lighten(#121212, 5)
|
||||
|
||||
.line:before
|
||||
color: alpha(#FFFFFF, .6) !important
|
||||
|
||||
.gutter pre
|
||||
background-color: lighten(#121212, 2) !important
|
||||
|
||||
.hljs
|
||||
background-color: lighten(#121212, 2) !important
|
||||
|
||||
.highlight-tools
|
||||
background: lighten(#121212, 3) !important
|
||||
color: #90a4ae !important
|
||||
|
||||
blockquote
|
||||
background-color: lighten(#121212, 10)
|
||||
color: alpha(#FFFFFF, .6)
|
||||
|
||||
hr
|
||||
border: 2px dashed alpha(#FFFFFF, .3)
|
||||
background: 0
|
||||
|
||||
&:before
|
||||
color: alpha(#FFFFFF, .6)
|
||||
|
||||
.layout_post .tag_share .post-meta__tags
|
||||
border: 1px solid alpha(#FFFFFF, .6)
|
||||
color: alpha(#FFFFFF, .6)
|
||||
|
||||
&:hover
|
||||
background: darken(#FFFFFF, 60)
|
||||
|
||||
// 文章版權
|
||||
.post-copyright
|
||||
border: 1px solid alpha(#FFFFFF, .6)
|
||||
|
||||
.post-copyright-meta
|
||||
color: alpha(#FFFFFF, .8)
|
||||
|
||||
.post-copyright-info
|
||||
color: alpha(#FFFFFF, .6)
|
||||
|
||||
&:after
|
||||
background: #121212
|
||||
|
||||
// 音樂播放器
|
||||
.aplayer
|
||||
filter: brightness(.7)
|
||||
color: $dark-black
|
||||
|
||||
// 右下角按鈕
|
||||
#rightside
|
||||
& > div
|
||||
& > button,
|
||||
& > a
|
||||
background-color: lighten(#121212, 5)
|
||||
color: alpha(#FFFFFF, .6)
|
||||
|
||||
&:hover
|
||||
background: lighten(#121212, 20)
|
||||
|
||||
// 打賞按鈕
|
||||
.post-reward
|
||||
.reward-button
|
||||
background-color: lighten(#121212, 10) !important
|
||||
|
||||
.reward-all
|
||||
background-color: lighten(#121212, 10) !important
|
||||
|
||||
&:after
|
||||
border-top: 13px solid lighten(#121212, 10) !important
|
||||
|
||||
.flink-list-item:before,
|
||||
.card-category-list-item a:hover,
|
||||
.card-archive-list-item a:hover,
|
||||
#bookmark-it
|
||||
background-color: lighten(#121212, 10) !important
|
||||
|
||||
img,
|
||||
.gist
|
||||
filter: brightness(.7)
|
||||
|
||||
#article-container iframe
|
||||
filter: brightness(.7)
|
||||
|
||||
// 側邊欄
|
||||
#aside_content
|
||||
.card-widget
|
||||
background: #121212 !important
|
||||
|
||||
.headline,
|
||||
.length_num,
|
||||
.aside-post_title,
|
||||
.card-category-list-link,
|
||||
.card-archive-list-link,
|
||||
.social-icon,
|
||||
.card-category-list-link-more,
|
||||
.card-archive-list-link-more
|
||||
color: alpha(#FFFFFF, .6) !important
|
||||
|
||||
.button--animated:before
|
||||
background: lighten(#121212, 20)
|
||||
|
||||
#post-meta,
|
||||
#post-meta a,
|
||||
#footer-wrap,
|
||||
#footer-wrap a,
|
||||
.img-alt
|
||||
color: alpha(#FFFFFF, .6) !important
|
||||
|
||||
.posttitle,
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6
|
||||
color: alpha(#FFFFFF, .8)
|
||||
|
||||
.recent-posts .post-meta__date,
|
||||
.recent-posts .article-meta,
|
||||
.recent-posts a,
|
||||
.post-reward .reward-button,
|
||||
.copy-button,
|
||||
.gutter pre,
|
||||
#bookmark-it,
|
||||
.copy-notice,
|
||||
.flink-list-item a,
|
||||
.category-list-link,
|
||||
.relatedPosts_date,
|
||||
.prev-post .label,
|
||||
.next-post .label
|
||||
color: alpha(#FFFFFF, .6) !important
|
||||
|
||||
.prev_info,
|
||||
.next_info,
|
||||
.relatedPosts_title
|
||||
color: alpha(#FFFFFF, .8) !important
|
||||
|
||||
// 時間軸界面
|
||||
.article-sort
|
||||
&-item__title
|
||||
color: alpha(#FFFFFF, .6)
|
||||
|
||||
&-item:before,
|
||||
&-title:before
|
||||
background: #121212
|
||||
|
||||
// 手機 MENU,TOC
|
||||
#mobile-sidebar
|
||||
#mobile-sidebar-menus
|
||||
background: #121212
|
||||
|
||||
.headline
|
||||
color: alpha(#FFFFFF, .6) !important
|
||||
|
||||
.length_num
|
||||
color: alpha(#FFFFFF, .8) !important
|
||||
|
||||
a
|
||||
color: alpha(#FFFFFF, .6) !important
|
||||
.highlight-tools
|
||||
background: lighten(#121212, 3) !important
|
||||
color: #90a4ae !important
|
||||
|
||||
#post-comment
|
||||
.comment-switch
|
||||
if hexo-config('comments.text')
|
||||
background: #2c2c2c
|
||||
background: #2c2c2c !important
|
||||
|
||||
label
|
||||
filter: brightness(.7)
|
||||
|
||||
.post-outdate-notice
|
||||
filter: brightness(.7)
|
||||
|
||||
// error 404
|
||||
#error-wrap
|
||||
.error-content
|
||||
background: #121212
|
||||
|
||||
.error-img
|
||||
filter: brightness(.7)
|
||||
|
||||
.error-info
|
||||
.error_title
|
||||
color: alpha(#FFFFFF, .8)
|
||||
|
||||
.error_subtitle
|
||||
color: alpha(#FFFFFF, .6)
|
||||
|
||||
a
|
||||
background: #2c2c2c
|
||||
|
||||
// note
|
||||
if hexo-config('note.style') == 'modern'
|
||||
if hexo-config('note.style') == 'modern' || hexo-config('note.style') == 'flat'
|
||||
.note
|
||||
filter: brightness(.7)
|
||||
|
||||
if hexo-config('note.style') == 'flat'
|
||||
.note
|
||||
filter: brightness(.7)
|
||||
color: #4c4948
|
||||
|
||||
// hide-tags
|
||||
.hide-button,
|
||||
.btn-beautify
|
||||
filter: brightness(.8)
|
||||
|
||||
// tabs
|
||||
#article-container
|
||||
.tabs
|
||||
border: 2px solid #2c2c2c
|
||||
border-top: none
|
||||
|
||||
> .nav-tabs
|
||||
background: #2c2c2c
|
||||
|
||||
button
|
||||
border-top: 2px solid #2c2c2c
|
||||
background: #2c2c2c
|
||||
color: alpha(#FFFFFF, .6)
|
||||
|
||||
.tab:not(.active)
|
||||
button
|
||||
&:hover
|
||||
border-top: 2px solid lighten(#121212, 20)
|
||||
background: lighten(#121212, 20)
|
||||
|
||||
.active
|
||||
button
|
||||
background: #121212
|
||||
.btn-beautify,
|
||||
.mermaid,
|
||||
.post-outdate-notice,
|
||||
.error-img,
|
||||
#article-container iframe,
|
||||
img,
|
||||
.gist,
|
||||
.aplayer
|
||||
filter: brightness(.7)
|
||||
|
||||
// 第三方
|
||||
// 插件 hexo-blog-encrypt
|
||||
@@ -326,81 +121,29 @@ if hexo-config('darkmode.enable') || hexo-config('display_mode') == 'dark'
|
||||
input
|
||||
background-color: #121212
|
||||
|
||||
.mermaid
|
||||
// Gitalk
|
||||
#gitalk-container
|
||||
filter: brightness(.7)
|
||||
|
||||
if hexo-config('gitalk') && hexo-config('gitalk.enable')
|
||||
#gitalk-container
|
||||
.gt-header-textarea,
|
||||
.gt-header-preview,
|
||||
.gt-comment-content,
|
||||
button,
|
||||
.gt-popup
|
||||
filter: brightness(.7)
|
||||
svg
|
||||
fill: alpha(#FFFFFF, .8) !important
|
||||
|
||||
svg
|
||||
fill: alpha(#FFFFFF, .6) !important
|
||||
|
||||
if hexo-config('valine') && hexo-config('valine.enable')
|
||||
#vcomment
|
||||
.vbtn,
|
||||
.vat
|
||||
border: 1px solid alpha(#FFFFFF, .6)
|
||||
background: #121212 !important
|
||||
color: alpha(#FFFFFF, .6) !important
|
||||
|
||||
&:hover
|
||||
background: lighten(#121212, 20) !important
|
||||
|
||||
if hexo-config('local_search') && hexo-config('local_search.enable')
|
||||
#local-search
|
||||
background: #121212
|
||||
|
||||
.local-search-box--input
|
||||
background: #121212
|
||||
// Disqus and Disqusjs
|
||||
#disqus_thread
|
||||
#dsqjs
|
||||
.dsqjs-tab-active,
|
||||
.dsqjs-no-comment
|
||||
color: alpha(#FFFFFF, .6)
|
||||
|
||||
.search-result-title
|
||||
.dsqjs-order-label
|
||||
background-color: lighten(#121212, 5)
|
||||
|
||||
.dsqjs-post-body
|
||||
color: alpha(#FFFFFF, .6)
|
||||
|
||||
if hexo-config('algolia_search.enable')
|
||||
#algolia-search
|
||||
background: #121212
|
||||
code,
|
||||
pre
|
||||
background: #2c2c2c
|
||||
|
||||
.ais-search-box--input
|
||||
background: #121212
|
||||
color: alpha(#FFFFFF, .6)
|
||||
|
||||
#algolia-search-results
|
||||
.algolia-hit-item-link
|
||||
blockquote
|
||||
color: alpha(#FFFFFF, .6)
|
||||
|
||||
if hexo-config('disqusjs.enable')
|
||||
#disqus_thread
|
||||
#dsqjs
|
||||
.dsqjs-tab-active,
|
||||
.dsqjs-no-comment
|
||||
color: alpha(#FFFFFF, .6)
|
||||
|
||||
.dsqjs-order-label
|
||||
background-color: lighten(#121212, 5)
|
||||
|
||||
.dsqjs-post-body
|
||||
color: alpha(#FFFFFF, .6)
|
||||
|
||||
code,
|
||||
pre
|
||||
background: #2c2c2c
|
||||
|
||||
blockquote
|
||||
color: alpha(#FFFFFF, .6)
|
||||
|
||||
if hexo-config('preloader')
|
||||
#loading-box
|
||||
.loading-left-bg,
|
||||
.loading-right-bg,
|
||||
.configure-core
|
||||
background-color: darken(#121212, 2)
|
||||
|
||||
.loading-word
|
||||
color: alpha(#FFFFFF, .6)
|
||||
|
||||
@@ -1,149 +1,29 @@
|
||||
if hexo-config('readmode')
|
||||
[data-theme='light']
|
||||
$light-redmode-bg = #fff
|
||||
|
||||
.read-mode
|
||||
background: $light-redmode-bg
|
||||
|
||||
#page-header.post-bg
|
||||
a
|
||||
color: $font-black !important
|
||||
|
||||
#article-container
|
||||
pre,
|
||||
.highlight:not(.js-file-line-container)
|
||||
background: #f7f7f7 !important
|
||||
|
||||
*
|
||||
color: $font-black !important
|
||||
|
||||
figure.highlight
|
||||
.line:before
|
||||
color: $font-black !important
|
||||
|
||||
.hljs
|
||||
background: #f7f7f7 !important
|
||||
|
||||
code
|
||||
color: #4c4948
|
||||
|
||||
blockquote
|
||||
border-left: .2rem solid #ddd
|
||||
background-color: $light-redmode-bg
|
||||
|
||||
ol,
|
||||
li
|
||||
&:before
|
||||
background: $light-redmode-bg
|
||||
color: #4c4948
|
||||
|
||||
ul
|
||||
>li
|
||||
&:before
|
||||
border: .2rem solid #90a4ae
|
||||
|
||||
hr
|
||||
border: 2px dashed #d6dbdf
|
||||
background: $light-redmode-bg
|
||||
|
||||
&:before
|
||||
color: darken(#d6dbdf, 10)
|
||||
|
||||
.hide-toggle
|
||||
border: 1px solid darken(#d6dbdf, 10) !important
|
||||
|
||||
.hide-button,
|
||||
.btn-beautify
|
||||
background: $light-redmode-bg !important
|
||||
color: #4c4948 !important
|
||||
|
||||
.btn-beautify
|
||||
border: 1px solid darken(#d6dbdf, 10)
|
||||
|
||||
&.button--animated:before
|
||||
background: $light-redmode-bg
|
||||
|
||||
.hide-inline,
|
||||
.hide-block
|
||||
& >.hide-button
|
||||
border: 1px solid darken(#d6dbdf, 10)
|
||||
|
||||
& > .button--animated:before
|
||||
background: $light-redmode-bg
|
||||
|
||||
.note
|
||||
border: 2px solid #eee
|
||||
background-color: $light-redmode-bg
|
||||
|
||||
.tabs
|
||||
border: 1px solid darken(#d6dbdf, 10)
|
||||
|
||||
#rightside button
|
||||
background: darken(#d6dbdf, 20) !important
|
||||
--font-color: #4c4948
|
||||
--readmode-light-color: #fff
|
||||
--white: #4c4948
|
||||
--light-grey: #4c4948
|
||||
--gray: #d6dbdf
|
||||
--hr-border: #d6dbdf
|
||||
--hr-before-color: darken(#d6dbdf, 10)
|
||||
-highlight-bg: #f7f7f7
|
||||
|
||||
[data-theme='dark']
|
||||
$dark-readmode-bg = #0d0d0d
|
||||
|
||||
.read-mode
|
||||
background: $dark-readmode-bg
|
||||
|
||||
#article-container
|
||||
pre,
|
||||
.highlight:not(.js-file-line-container)
|
||||
*
|
||||
color: rgba(255, 255, 255, .6) !important
|
||||
|
||||
code
|
||||
color: rgba(255, 255, 255, .6)
|
||||
|
||||
blockquote
|
||||
border-left: .2rem solid rgba(255, 255, 255, .6)
|
||||
background-color: $dark-readmode-bg
|
||||
|
||||
ol,
|
||||
li
|
||||
&:before
|
||||
background: $dark-readmode-bg
|
||||
color: rgba(255, 255, 255, .6)
|
||||
|
||||
ul
|
||||
>li
|
||||
&:before
|
||||
border: .15rem solid rgba(255, 255, 255, .6)
|
||||
|
||||
.hide-toggle
|
||||
border: 1px solid rgba(255, 255, 255, .6) !important
|
||||
|
||||
.hide-button,
|
||||
.btn-beautify
|
||||
background: $dark-readmode-bg !important
|
||||
filter: none
|
||||
color: rgba(255, 255, 255, .6) !important
|
||||
|
||||
.btn-beautify
|
||||
border: 1px solid rgba(255, 255, 255, .6)
|
||||
|
||||
&.button--animated:before
|
||||
background: $dark-readmode-bg !important
|
||||
|
||||
.hide-inline,
|
||||
.hide-block
|
||||
& >.hide-button
|
||||
border: 1px solid rgba(255, 255, 255, .6)
|
||||
|
||||
& > .button--animated:before
|
||||
background: $dark-readmode-bg !important
|
||||
|
||||
.note
|
||||
border: 2px solid rgba(255, 255, 255, .6)
|
||||
filter: none
|
||||
background-color: $dark-readmode-bg
|
||||
color: rgba(255, 255, 255, .6)
|
||||
|
||||
.tabs
|
||||
border: 2px solid rgba(255, 255, 255, .6)
|
||||
--font-color: rgba(255, 255, 255, .6)
|
||||
--readmode-light-color: #0d0d0d
|
||||
--white: rgba(255, 255, 255, .8)
|
||||
--light-grey: rgba(255, 255, 255, .6)
|
||||
--gray: rgba(255, 255, 255, .6)
|
||||
--hr-border: rgba(255, 255, 255, .3)
|
||||
--hr-before-color: rgba(255, 255, 255, .6)
|
||||
-highlight-bg: #171717
|
||||
|
||||
.read-mode
|
||||
background: var(--readmode-light-color)
|
||||
|
||||
#body-wrap
|
||||
padding-left: 0 !important
|
||||
|
||||
@@ -151,15 +31,11 @@ if hexo-config('readmode')
|
||||
background-color: transparent
|
||||
background-image: none !important
|
||||
|
||||
a
|
||||
text-shadow: none !important
|
||||
|
||||
&:before
|
||||
opacity: 0
|
||||
|
||||
& > #post-info
|
||||
padding: 0
|
||||
color: $font-black
|
||||
text-align: center
|
||||
|
||||
.layout_post
|
||||
@@ -170,13 +46,6 @@ if hexo-config('readmode')
|
||||
&:hover
|
||||
box-shadow: none
|
||||
|
||||
figure.highlight
|
||||
border-radius: 0 !important
|
||||
box-shadow: none !important
|
||||
|
||||
& > :not(.highlight-tools)
|
||||
display: block !important
|
||||
|
||||
& > canvas
|
||||
display: none !important
|
||||
|
||||
@@ -188,11 +57,9 @@ if hexo-config('readmode')
|
||||
#toggle-sidebar,
|
||||
#mobile-toc-button,
|
||||
#nav,
|
||||
.post-outdate-notice
|
||||
display: none !important
|
||||
|
||||
.post-outdate-notice,
|
||||
#web_bg
|
||||
background: none
|
||||
display: none !important
|
||||
|
||||
if !hexo-config('chat_btn')
|
||||
#chatra,
|
||||
@@ -204,6 +71,29 @@ if hexo-config('readmode')
|
||||
display: none !important
|
||||
|
||||
#article-container
|
||||
a
|
||||
color: #99a9bf
|
||||
|
||||
pre,
|
||||
.highlight:not(.js-file-line-container)
|
||||
background: var(-highlight-bg) !important
|
||||
|
||||
*
|
||||
color: var(--font-color) !important
|
||||
|
||||
figure.highlight
|
||||
border-radius: 0 !important
|
||||
box-shadow: none !important
|
||||
|
||||
& > :not(.highlight-tools)
|
||||
display: block !important
|
||||
|
||||
.line:before
|
||||
color: var(--font-color) !important
|
||||
|
||||
.hljs
|
||||
background: var(-highlight-bg) !important
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
@@ -224,7 +114,20 @@ if hexo-config('readmode')
|
||||
&:hover:before
|
||||
transform: none !important
|
||||
|
||||
ol,
|
||||
li
|
||||
&:before
|
||||
background: transparent !important
|
||||
color: var(--font-color) !important
|
||||
|
||||
ul
|
||||
>li
|
||||
&:before
|
||||
border: .15rem solid var(--gray) !important
|
||||
|
||||
.tabs
|
||||
border: 2px solid var(--tab-border-color)
|
||||
|
||||
> .nav-tabs
|
||||
background: transparent
|
||||
|
||||
@@ -244,3 +147,38 @@ if hexo-config('readmode')
|
||||
|
||||
> .tab-contents .tab-item-content.active
|
||||
animation: none
|
||||
|
||||
code
|
||||
color: var(--font-color)
|
||||
|
||||
blockquote
|
||||
border-left: .2rem solid var(--gray)
|
||||
background-color: var(--readmode-light-color)
|
||||
|
||||
.hide-toggle
|
||||
border: 1px solid var(--gray) !important
|
||||
|
||||
.hide-button,
|
||||
.btn-beautify
|
||||
background: var(--readmode-light-color) !important
|
||||
color: var(--font-color) !important
|
||||
|
||||
.btn-beautify
|
||||
border: 1px solid var(--gray) !important
|
||||
|
||||
.button--animated:before
|
||||
background: var(--readmode-light-color) !important
|
||||
|
||||
.hide-inline,
|
||||
.hide-block
|
||||
& >.hide-button
|
||||
border: 1px solid var(--gray)
|
||||
|
||||
& > .button--animated:before
|
||||
background: var(--readmode-light-color)
|
||||
|
||||
.note
|
||||
border: 2px solid var(--gray)
|
||||
filter: none
|
||||
background-color: var(--readmode-light-color)
|
||||
color: var(--font-color)
|
||||
@@ -11,7 +11,8 @@
|
||||
outline: none
|
||||
border: 2px solid $search-color
|
||||
border-radius: 2rem
|
||||
background: $search-bg
|
||||
background: var(--search-bg)
|
||||
color: var(--search-input-color)
|
||||
font-size: 14px
|
||||
|
||||
.ais-hits--item.algolia-hit-item
|
||||
@@ -20,7 +21,7 @@
|
||||
|
||||
&:hover
|
||||
&:before
|
||||
border-color: $theme-button-hover-color
|
||||
border-color: $pseudo-hover
|
||||
|
||||
&:before
|
||||
$w = .3rem
|
||||
@@ -38,7 +39,7 @@
|
||||
|
||||
a
|
||||
display: block
|
||||
color: $font-black
|
||||
color: var(--search-result-title)
|
||||
font-size: 14px
|
||||
cursor: pointer
|
||||
|
||||
|
||||
@@ -7,7 +7,14 @@
|
||||
margin-left: -15rem
|
||||
padding: 1rem
|
||||
width: 30rem
|
||||
background: $search-bg
|
||||
background: var(--search-bg)
|
||||
|
||||
@media screen and (max-width: $sm)
|
||||
top: 0
|
||||
left: 0
|
||||
margin: 0
|
||||
width: 100%
|
||||
height: 100%
|
||||
|
||||
hr
|
||||
margin: 1rem auto
|
||||
@@ -31,7 +38,7 @@
|
||||
font-size: 1rem
|
||||
line-height: 1
|
||||
|
||||
.search-mask
|
||||
#search-mask
|
||||
position: fixed
|
||||
top: 0
|
||||
right: 0
|
||||
@@ -39,16 +46,4 @@
|
||||
left: 0
|
||||
z-index: 1000
|
||||
display: none
|
||||
background: rgba($dark-black, .6)
|
||||
|
||||
@media screen and (max-width: $sm)
|
||||
.search-dialog
|
||||
top: 0
|
||||
left: 0
|
||||
margin: 0
|
||||
width: 100%
|
||||
height: 100%
|
||||
|
||||
.search-result-list
|
||||
padding-bottom: 2rem
|
||||
max-height: 75vh !important
|
||||
background: rgba($dark-black, .6)
|
||||
@@ -12,7 +12,8 @@
|
||||
outline: none
|
||||
border: 2px solid $search-color
|
||||
border-radius: 2rem
|
||||
background: $search-bg
|
||||
background: var(--search-bg)
|
||||
color: var(--search-input-color)
|
||||
font-size: 14px
|
||||
-webkit-appearance: none
|
||||
|
||||
@@ -23,7 +24,7 @@
|
||||
|
||||
&:hover
|
||||
&:before
|
||||
border-color: $theme-button-hover-color
|
||||
border-color: $pseudo-hover
|
||||
|
||||
&:before
|
||||
$w = .3rem
|
||||
@@ -41,7 +42,7 @@
|
||||
|
||||
a
|
||||
display: block
|
||||
color: $font-black
|
||||
color: var(--search-result-title)
|
||||
font-weight: 600
|
||||
font-size: 14px
|
||||
cursor: pointer
|
||||
@@ -62,4 +63,8 @@
|
||||
|
||||
.search-result-list
|
||||
overflow-y: auto
|
||||
max-height: 10.5rem
|
||||
max-height: 10.5rem
|
||||
|
||||
@media screen and (max-width: $sm)
|
||||
padding-bottom: 2rem
|
||||
max-height: 75vh !important
|
||||
|
||||
@@ -4,8 +4,6 @@
|
||||
text-align: center
|
||||
|
||||
.btn-beautify
|
||||
position: relative
|
||||
z-index: 1
|
||||
display: inline-block
|
||||
margin: 0 .2rem .3rem
|
||||
padding: 0 1rem
|
||||
|
||||
@@ -2,12 +2,10 @@
|
||||
.hide-inline,
|
||||
.hide-block
|
||||
& > .hide-button
|
||||
position: relative
|
||||
z-index: 1
|
||||
display: inline-block
|
||||
padding: .3rem 1rem
|
||||
background: $tag-hide-bg
|
||||
color: $white !important
|
||||
color: var(--white)
|
||||
|
||||
&.open
|
||||
display: none
|
||||
@@ -32,7 +30,7 @@
|
||||
& > .hide-button
|
||||
padding: .3rem .5rem
|
||||
background: $tag-hide-toggle-bg
|
||||
color: $font-color
|
||||
color: #1F2D3D
|
||||
cursor: pointer
|
||||
|
||||
& > i
|
||||
|
||||
@@ -4,19 +4,22 @@
|
||||
position: relative
|
||||
margin: 0 0 1rem
|
||||
padding: 15px
|
||||
|
||||
|
||||
if ($note-style == 'simple')
|
||||
border: 1px solid $light-grey
|
||||
border: 1px solid #EEEEEE
|
||||
border-left-width: 5px
|
||||
|
||||
if ($note-style == 'modern')
|
||||
border: 1px solid transparent
|
||||
background-color: $whitesmoke
|
||||
background-color: var(--white)smoke
|
||||
|
||||
|
||||
if ($note-style == 'flat')
|
||||
border: initial
|
||||
border-left: 5px solid $light-grey
|
||||
background-color: lighten($light-grey, 65%)
|
||||
color: $font-black
|
||||
border-left: 5px solid #EEEEEE
|
||||
background-color: lighten(#EEEEEE, 65%)
|
||||
|
||||
if hexo-config('note.border_radius') is a 'unit'
|
||||
border-radius: unit(hexo-config('note.border_radius'), px)
|
||||
@@ -47,6 +50,9 @@
|
||||
|
||||
&:last-child
|
||||
margin-bottom: 0 !important
|
||||
|
||||
code
|
||||
background: $code-background !important
|
||||
|
||||
if $note-icons
|
||||
&:not(.no-icon)
|
||||
@@ -69,14 +75,11 @@
|
||||
background: lookup('$note-modern-' + $type + '-bg')
|
||||
color: lookup('$note-modern-' + $type + '-text')
|
||||
|
||||
a,
|
||||
span.exturl
|
||||
a
|
||||
&:not(.btn)
|
||||
border-bottom: 1px solid lookup('$note-modern-' + $type + '-text')
|
||||
color: lookup('$note-modern-' + $type + '-text')
|
||||
|
||||
&:hover
|
||||
border-bottom: 1px solid lookup('$note-modern-' + $type + '-hover')
|
||||
color: lookup('$note-modern-' + $type + '-hover')
|
||||
|
||||
if ($note-style != 'modern')
|
||||
|
||||
@@ -1,16 +1,18 @@
|
||||
|
||||
#article-container
|
||||
.tabs
|
||||
position: relative
|
||||
margin: 0 0 1rem
|
||||
border: 1px solid $tab-border-color
|
||||
border-top: none
|
||||
border-right: 1px solid var(--tab-border-color)
|
||||
border-bottom: 1px solid var(--tab-border-color)
|
||||
border-left: 1px solid var(--tab-border-color)
|
||||
|
||||
> .nav-tabs
|
||||
display: flex
|
||||
flex-wrap: wrap
|
||||
margin: 0
|
||||
padding: 0
|
||||
background: $tab-botton-bg
|
||||
background: var(--tab-botton-bg)
|
||||
|
||||
> .tab
|
||||
margin: 0
|
||||
@@ -24,25 +26,27 @@
|
||||
display: block
|
||||
padding: .5rem 1rem
|
||||
width: 100%
|
||||
border-top: 2px solid $tab-border-color
|
||||
background: $tab-botton-bg
|
||||
color: $font-color
|
||||
border-top: 2px solid var(--tab-border-color)
|
||||
background: var(--tab-botton-bg)
|
||||
color: var(--tab-botton-color)
|
||||
line-height: 2
|
||||
transition: all .4s
|
||||
|
||||
&:hover
|
||||
border-top: 2px solid $tab-button-hover-bg
|
||||
background: $tab-button-hover-bg
|
||||
|
||||
i
|
||||
width: 1.5em
|
||||
|
||||
&.active
|
||||
button
|
||||
border-top: 2px solid $tab-active-border-color
|
||||
background: $card-bg
|
||||
background: var(--tab-button-active-bg)
|
||||
cursor: default
|
||||
|
||||
&:not(.active)
|
||||
button
|
||||
&:hover
|
||||
border-top: 2px solid var(--tab-button-hover-bg)
|
||||
background: var(--tab-button-hover-bg)
|
||||
|
||||
> .tab-contents
|
||||
.tab-item-content
|
||||
position: relative
|
||||
|
||||
181
source/css/_third-party/normalize.min.css
vendored
181
source/css/_third-party/normalize.min.css
vendored
@@ -1 +1,180 @@
|
||||
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}
|
||||
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
|
||||
html {
|
||||
line-height: 1.15;
|
||||
-webkit-text-size-adjust: 100%
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0
|
||||
}
|
||||
|
||||
main {
|
||||
display: block
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 2em;
|
||||
margin: .67em 0
|
||||
}
|
||||
|
||||
hr {
|
||||
box-sizing: content-box;
|
||||
height: 0;
|
||||
overflow: visible
|
||||
}
|
||||
|
||||
pre {
|
||||
font-family: monospace, monospace;
|
||||
font-size: 1em
|
||||
}
|
||||
|
||||
a {
|
||||
background-color: transparent
|
||||
}
|
||||
|
||||
abbr[title] {
|
||||
border-bottom: none;
|
||||
text-decoration: underline;
|
||||
text-decoration: underline dotted
|
||||
}
|
||||
|
||||
b,
|
||||
strong {
|
||||
font-weight: bolder
|
||||
}
|
||||
|
||||
code,
|
||||
kbd,
|
||||
samp {
|
||||
font-family: monospace, monospace;
|
||||
font-size: 1em
|
||||
}
|
||||
|
||||
small {
|
||||
font-size: 80%
|
||||
}
|
||||
|
||||
sub,
|
||||
sup {
|
||||
font-size: 75%;
|
||||
line-height: 0;
|
||||
position: relative;
|
||||
vertical-align: baseline
|
||||
}
|
||||
|
||||
sub {
|
||||
bottom: -.25em
|
||||
}
|
||||
|
||||
sup {
|
||||
top: -.5em
|
||||
}
|
||||
|
||||
img {
|
||||
border-style: none
|
||||
}
|
||||
|
||||
button,
|
||||
input,
|
||||
optgroup,
|
||||
select,
|
||||
textarea {
|
||||
font-family: inherit;
|
||||
font-size: 100%;
|
||||
line-height: 1.15;
|
||||
margin: 0
|
||||
}
|
||||
|
||||
button,
|
||||
input {
|
||||
overflow: visible
|
||||
}
|
||||
|
||||
button,
|
||||
select {
|
||||
text-transform: none
|
||||
}
|
||||
|
||||
[type=button],
|
||||
[type=reset],
|
||||
[type=submit],
|
||||
button {
|
||||
-webkit-appearance: button
|
||||
}
|
||||
|
||||
[type=button]::-moz-focus-inner,
|
||||
[type=reset]::-moz-focus-inner,
|
||||
[type=submit]::-moz-focus-inner,
|
||||
button::-moz-focus-inner {
|
||||
border-style: none;
|
||||
padding: 0
|
||||
}
|
||||
|
||||
[type=button]:-moz-focusring,
|
||||
[type=reset]:-moz-focusring,
|
||||
[type=submit]:-moz-focusring,
|
||||
button:-moz-focusring {
|
||||
outline: 1px dotted ButtonText
|
||||
}
|
||||
|
||||
fieldset {
|
||||
padding: .35em .75em .625em
|
||||
}
|
||||
|
||||
legend {
|
||||
box-sizing: border-box;
|
||||
color: inherit;
|
||||
display: table;
|
||||
max-width: 100%;
|
||||
padding: 0;
|
||||
white-space: normal
|
||||
}
|
||||
|
||||
progress {
|
||||
vertical-align: baseline
|
||||
}
|
||||
|
||||
textarea {
|
||||
overflow: auto
|
||||
}
|
||||
|
||||
[type=checkbox],
|
||||
[type=radio] {
|
||||
box-sizing: border-box;
|
||||
padding: 0
|
||||
}
|
||||
|
||||
[type=number]::-webkit-inner-spin-button,
|
||||
[type=number]::-webkit-outer-spin-button {
|
||||
height: auto
|
||||
}
|
||||
|
||||
[type=search] {
|
||||
-webkit-appearance: textfield;
|
||||
outline-offset: -2px
|
||||
}
|
||||
|
||||
[type=search]::-webkit-search-decoration {
|
||||
-webkit-appearance: none
|
||||
}
|
||||
|
||||
::-webkit-file-upload-button {
|
||||
-webkit-appearance: button;
|
||||
font: inherit
|
||||
}
|
||||
|
||||
details {
|
||||
display: block
|
||||
}
|
||||
|
||||
summary {
|
||||
display: list-item
|
||||
}
|
||||
|
||||
template {
|
||||
display: none
|
||||
}
|
||||
|
||||
[hidden] {
|
||||
display: none
|
||||
}
|
||||
@@ -6,7 +6,6 @@ $light-red = #F47466
|
||||
$themeColorEnable = hexo-config('theme_color') && hexo-config('theme_color.enable')
|
||||
$theme-color = $themeColorEnable ? convert(hexo-config('theme_color.main')) : $bright-blue
|
||||
$theme-paginator-color = $themeColorEnable ? convert(hexo-config('theme_color.paginator')) : $strong-cyan
|
||||
$theme-button-hover-color = $themeColorEnable ? convert(hexo-config('theme_color.button_hover')) : $light-orange
|
||||
$theme-text-selection-color = $themeColorEnable ? convert(hexo-config('theme_color.text_selection')) : $strong-cyan
|
||||
$theme-link-color = $themeColorEnable ? convert(hexo-config('theme_color.link_color')) : $bright-blue
|
||||
$theme-hr-color = $themeColorEnable ? convert(hexo-config('theme_color.hr_color')) : $bright-blue
|
||||
@@ -30,7 +29,6 @@ $title-prefix-icon-color = $beautifyEnable ? convert(hexo-config('beautify.title
|
||||
// Global Variables
|
||||
$font-size = 14px
|
||||
$font-color = #1F2D3D
|
||||
$button-color = #fff
|
||||
$rem = 20px
|
||||
$text-line-height = 2
|
||||
$sm = 768px
|
||||
@@ -48,6 +46,9 @@ $white = #FFFFFF
|
||||
$whitesmoke = #f5f5f5
|
||||
$font-black = #4C4948
|
||||
$card-bg = $white
|
||||
$text-highlight-color = $font-color
|
||||
$text-hover = $theme-color
|
||||
$text-bg-hover = $theme-color
|
||||
// code
|
||||
$line-height-code-block = 20px
|
||||
$blockquote-color = #6a737d
|
||||
@@ -66,6 +67,12 @@ $sidebar-width = 300px
|
||||
$sidebar-background = #f6f8fa
|
||||
$sidebar-active-color = #fff
|
||||
$mobile-sidebar-width = 250px
|
||||
// Button
|
||||
$button-color = #fff
|
||||
$button-hover-color = $themeColorEnable ? convert(hexo-config('theme_color.button_hover')) : $light-orange
|
||||
$button-bg= $theme-color
|
||||
$pseudo-hover = $button-hover-color
|
||||
|
||||
// table
|
||||
$table-thead-bg = #99a9bf
|
||||
// reward
|
||||
@@ -73,8 +80,10 @@ $reward-pop-up-bg = #f5f5f5
|
||||
$reward-pop-up-color = #858585
|
||||
// search
|
||||
$search-bg = #f6f8fa
|
||||
$search-input-color= $font-black
|
||||
$search-color = $theme-color
|
||||
$search-keyword-highlight = #F47466
|
||||
$search-result-title= $font-black
|
||||
// comments
|
||||
$comments-switch-first-text = $bright-blue
|
||||
$comments-switch-second-text = $light-orange
|
||||
@@ -91,6 +100,7 @@ $tag-hide-bg = $theme-color
|
||||
$tag-hide-toggle-bg = #f0f0f0
|
||||
// preloader
|
||||
$preloader-bg = #37474f
|
||||
$preloader-word-color = #fff
|
||||
// rightside
|
||||
$rightside-bottom = hexo-config('rightside-bottom') is a 'unit' ? unit(hexo-config('rightside-bottom'), px) : 40px
|
||||
// fireworks
|
||||
@@ -165,6 +175,8 @@ $btn-green-color = #5cb85c
|
||||
// Tag Plugins - Tab
|
||||
$tab-border-color = #f0f0f0
|
||||
$tab-botton-bg = #f0f0f0
|
||||
$tab-botton-color = $font-color
|
||||
$tab-button-hover-bg = darken($tab-border-color, 8)
|
||||
$tab-active-border-color = $theme-color
|
||||
$tab-button-active-bg= $card-bg
|
||||
$tab-to-top-color = #99a9bf
|
||||
File diff suppressed because it is too large
Load Diff
@@ -1,9 +1,9 @@
|
||||
$(function () {
|
||||
$('a.social-icon.search').on('click', function () {
|
||||
const openSearch = () => {
|
||||
$('body').css({ width: '100%', overflow: 'hidden' })
|
||||
$('.search-dialog').css('display', 'block')
|
||||
$('#algolia-search').css('display', 'block')
|
||||
$('.ais-search-box--input').focus()
|
||||
$('.search-mask').fadeIn()
|
||||
$('#search-mask').fadeIn()
|
||||
// shortcut: ESC
|
||||
document.addEventListener('keydown', function f (event) {
|
||||
if (event.code === 'Escape') {
|
||||
@@ -11,27 +11,35 @@ $(function () {
|
||||
document.removeEventListener('keydown', f)
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
const closeSearch = function () {
|
||||
$('body').css('width', '')
|
||||
$('body').css('overflow', '')
|
||||
$('.search-dialog').css({
|
||||
const closeSearch = () => {
|
||||
$('body').css({ width: '', overflow: '' })
|
||||
$('#algolia-search').css({
|
||||
animation: 'search_close .5s'
|
||||
})
|
||||
|
||||
$('.search-dialog').animate({}, function () {
|
||||
setTimeout(function () {
|
||||
$('.search-dialog').css({
|
||||
animation: '',
|
||||
display: 'none'
|
||||
})
|
||||
}, 500)
|
||||
})
|
||||
setTimeout(function () {
|
||||
$('#algolia-search').css({
|
||||
animation: '',
|
||||
display: 'none'
|
||||
})
|
||||
}, 500)
|
||||
|
||||
$('.search-mask').fadeOut()
|
||||
$('#search-mask').fadeOut()
|
||||
}
|
||||
$('.search-mask, .search-close-button').on('click touchstart', closeSearch)
|
||||
|
||||
const searchClickFn = () => {
|
||||
$('a.social-icon.search').on('click', openSearch)
|
||||
$('#search-mask, .search-close-button').on('click touchstart', closeSearch)
|
||||
}
|
||||
|
||||
searchClickFn()
|
||||
|
||||
window.addEventListener('pjax:success', function () {
|
||||
closeSearch()
|
||||
searchClickFn()
|
||||
})
|
||||
|
||||
const algolia = GLOBAL_CONFIG.algolia
|
||||
const isAlgoliaValid = algolia.appId && algolia.apiKey && algolia.indexName
|
||||
@@ -130,4 +138,8 @@ $(function () {
|
||||
})
|
||||
)
|
||||
search.start()
|
||||
|
||||
window.pjax && search.on('render', () => {
|
||||
window.pjax.refresh(document.getElementById('algolia-hits'))
|
||||
})
|
||||
})
|
||||
|
||||
@@ -1,13 +1,13 @@
|
||||
$(function () {
|
||||
let loadFlag = false
|
||||
$('a.social-icon.search').on('click', function () {
|
||||
const openSearch = function () {
|
||||
$('body').css({
|
||||
width: '100%',
|
||||
overflow: 'hidden'
|
||||
})
|
||||
$('.search-dialog').css('display', 'block')
|
||||
$('#local-search').css('display', 'block')
|
||||
$('#local-search-input input').focus()
|
||||
$('.search-mask').fadeIn()
|
||||
$('#search-mask').fadeIn()
|
||||
if (!loadFlag) {
|
||||
search(GLOBAL_CONFIG.localSearch.path)
|
||||
loadFlag = true
|
||||
@@ -20,27 +20,37 @@ $(function () {
|
||||
document.removeEventListener('keydown', f)
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
const closeSearch = function () {
|
||||
$('body').css('width', '')
|
||||
$('body').css('overflow', '')
|
||||
$('.search-dialog').css({
|
||||
$('body').css({
|
||||
width: '',
|
||||
overflow: ''
|
||||
})
|
||||
$('#local-search').css({
|
||||
animation: 'search_close .5s'
|
||||
})
|
||||
|
||||
$('.search-dialog').animate({}, function () {
|
||||
setTimeout(function () {
|
||||
$('.search-dialog').css({
|
||||
animation: '',
|
||||
display: 'none'
|
||||
})
|
||||
}, 500)
|
||||
})
|
||||
setTimeout(function () {
|
||||
$('#local-search').css({
|
||||
animation: '',
|
||||
display: 'none'
|
||||
})
|
||||
}, 500)
|
||||
|
||||
$('.search-mask').fadeOut()
|
||||
$('#search-mask').fadeOut()
|
||||
}
|
||||
$('.search-mask, .search-close-button').on('click touchstart', closeSearch)
|
||||
|
||||
const searchClickFn = () => {
|
||||
$('a.social-icon.search').on('click', openSearch)
|
||||
$('#search-mask, .search-close-button').on('click', closeSearch)
|
||||
}
|
||||
|
||||
searchClickFn()
|
||||
window.addEventListener('pjax:success', function () {
|
||||
$('#local-search').is(':visible') && closeSearch()
|
||||
searchClickFn()
|
||||
})
|
||||
|
||||
function search (path) {
|
||||
$.ajax({
|
||||
@@ -145,6 +155,7 @@ $(function () {
|
||||
}
|
||||
str += '</div>'
|
||||
$resultContent.innerHTML = str
|
||||
window.pjax && window.pjax.refresh($resultContent)
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
@@ -6,7 +6,6 @@
|
||||
const translateDelay = translate.translateDelay // 延遲時間,若不在前, 要設定延遲翻譯時間, 如100表示100ms,默認為0
|
||||
const msgToTraditionalChinese = translate.msgToTraditionalChinese // 此處可以更改為你想要顯示的文字
|
||||
const msgToSimplifiedChinese = translate.msgToSimplifiedChinese // 同上，但兩處均不建議更改
|
||||
const translateButtonId = 'translateLink' // 默認互換id
|
||||
let currentEncoding = defaultEncoding
|
||||
const targetEncodingCookie = 'translate-chn-cht'
|
||||
let targetEncoding =
|
||||
@@ -86,7 +85,7 @@
|
||||
return str
|
||||
}
|
||||
function translateInitilization () {
|
||||
translateButtonObject = document.getElementById(translateButtonId)
|
||||
translateButtonObject = document.getElementById('translateLink')
|
||||
if (translateButtonObject) {
|
||||
if (currentEncoding !== targetEncoding) {
|
||||
setTimeout(function () { translateBody() }, translateDelay)
|
||||
@@ -96,4 +95,5 @@
|
||||
}
|
||||
}
|
||||
translateInitilization()
|
||||
document.addEventListener('pjax:complete', translateInitilization)
|
||||
})()
|
||||
|
||||
@@ -59,25 +59,6 @@ function sidebarPaddingR () {
|
||||
}
|
||||
}
|
||||
|
||||
// iPadOS
|
||||
function isIpad () {
|
||||
return navigator.platform === 'MacIntel' && navigator.maxTouchPoints > 1
|
||||
}
|
||||
|
||||
function isTMobile () {
|
||||
const ua = navigator.userAgent
|
||||
const pa = /iPad|iPhone|iPod|Android|Opera Mini|BlackBerry|webOS|UCWEB|Blazer|PSP|IEMobile|Symbian/g
|
||||
return window.screen.width < 992 && pa.test(ua)
|
||||
}
|
||||
|
||||
function isMobile () {
|
||||
return this.isIpad() || this.isTMobile()
|
||||
}
|
||||
|
||||
function isDesktop () {
|
||||
return !this.isMobile()
|
||||
}
|
||||
|
||||
function scrollToDest (name, offset = 0) {
|
||||
const scrollOffset = $(name).offset()
|
||||
$('body,html').animate({
|
||||
@@ -85,26 +66,6 @@ function scrollToDest (name, offset = 0) {
|
||||
})
|
||||
};
|
||||
|
||||
function loadScript (url, callback) {
|
||||
const script = document.createElement('script')
|
||||
script.type = 'text/javascript'
|
||||
if (script.readyState) { // IE
|
||||
script.onreadystatechange = function () {
|
||||
if (script.readyState === 'loaded' ||
|
||||
script.readyState === 'complete') {
|
||||
script.onreadystatechange = null
|
||||
callback()
|
||||
}
|
||||
}
|
||||
} else { // Others
|
||||
script.onload = function () {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
script.src = url
|
||||
document.body.appendChild(script)
|
||||
};
|
||||
|
||||
function snackbarShow (text, showAction, duration) {
|
||||
const sa = (typeof showAction !== 'undefined') ? showAction : false
|
||||
const dur = (typeof duration !== 'undefined') ? duration : 2000
|
||||
@@ -147,12 +108,10 @@ const initJustifiedGallery = function (selector) {
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* lazyload
|
||||
*/
|
||||
if (GLOBAL_CONFIG.islazyload) {
|
||||
window.lazyLoadOptions = {
|
||||
elements_selector: 'img',
|
||||
threshold: 0
|
||||
}
|
||||
const diffDate = function (d) {
|
||||
const dateNow = new Date()
|
||||
const datePost = new Date(d.replace(/-/g, '/'))
|
||||
const dateDiff = dateNow.getTime() - datePost.getTime()
|
||||
const dayDiff = Math.floor(dateDiff / (24 * 3600 * 1000))
|
||||
return dayDiff
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user