mirror of
https://github.com/jerryc127/hexo-theme-butterfly.git
synced 2026-04-16 19:30:54 +08:00
first commit
This commit is contained in:
Jerry
342
source/css/_global/index.styl
Normal file
342
source/css/_global/index.styl
Normal file
@@ -0,0 +1,342 @@
|
||||
html
|
||||
height: 100%
|
||||
font-size: $rem
|
||||
|
||||
body
|
||||
position: relative
|
||||
display: flex
|
||||
flex-direction: column
|
||||
min-height: 100%
|
||||
background: #fff
|
||||
color: $font-black
|
||||
font-size: $font-size
|
||||
font-family: $font-family
|
||||
line-height: $text-line-height
|
||||
|
||||
*::-webkit-scrollbar
|
||||
width: 8px
|
||||
height: 8px
|
||||
|
||||
*::-webkit-scrollbar-thumb
|
||||
background: $light-blue
|
||||
|
||||
*::-webkit-scrollbar-track
|
||||
background-color: transparent
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6
|
||||
position: relative
|
||||
margin: 0.2rem 0
|
||||
color: lighten($font-color, 15%)
|
||||
font-weight: bold
|
||||
|
||||
#content-outer
|
||||
flex: 1 auto
|
||||
|
||||
*
|
||||
box-sizing: border-box
|
||||
|
||||
#content-inner
|
||||
.img-alt
|
||||
text-decoration: none
|
||||
color: $a-link-color
|
||||
|
||||
#toggle-sidebar
|
||||
position: fixed
|
||||
bottom: $sidebar-icon-top
|
||||
left: $sidebar-icon-left
|
||||
z-index: 100
|
||||
font-size: $sidebar-icon-size
|
||||
cursor: pointer
|
||||
transition: all 0.2s
|
||||
opacity: 0
|
||||
|
||||
#go-up
|
||||
position: fixed
|
||||
right: $go-up-right
|
||||
bottom: $go-up-bottom
|
||||
z-index: 100
|
||||
font-size: $sidebar-icon-size
|
||||
opacity: 0
|
||||
cursor: pointer
|
||||
transition: all .2s
|
||||
|
||||
.fancybox-caption
|
||||
text-align: center
|
||||
|
||||
|
||||
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: -10px
|
||||
left: 5%
|
||||
z-index: 1
|
||||
color: $light-blue
|
||||
content: "\f0c4"
|
||||
font: normal normal normal 14px / 1 FontAwesome
|
||||
font-size: 20px
|
||||
transition: all 1s ease-in-out
|
||||
|
||||
// collapse/expand beautify
|
||||
details
|
||||
padding: 0.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: 0.5em
|
||||
padding: 0.5em
|
||||
border: thin silver solid
|
||||
text-align: center
|
||||
|
||||
table
|
||||
overflow: auto
|
||||
width: 100%
|
||||
border-spacing: 0
|
||||
border-collapse: collapse
|
||||
|
||||
thead
|
||||
background: alpha($a-link-color, 10%)
|
||||
|
||||
th,
|
||||
td
|
||||
padding: 0.3rem 0.6rem
|
||||
border: 1px solid darken($light-grey, 10%)
|
||||
vertical-align: top
|
||||
|
||||
*::selection
|
||||
background: $selection
|
||||
color: $pale-grey
|
||||
|
||||
.text-center
|
||||
text-align: center
|
||||
.pull-left
|
||||
float: left
|
||||
|
||||
.pull-right
|
||||
float: right
|
||||
|
||||
@media screen and (max-width: $bg)
|
||||
i#toggle-sidebar,
|
||||
#sidebar
|
||||
display: none
|
||||
|
||||
body
|
||||
padding-left: 0 !important
|
||||
|
||||
|
||||
|
||||
// valine
|
||||
#vcomment
|
||||
input
|
||||
font-size: 0.65rem
|
||||
|
||||
button
|
||||
font-size: .7rem;
|
||||
padding: .3rem 1rem;
|
||||
background-color: #49b1f5;
|
||||
color: #fff;
|
||||
border-color: #fff;
|
||||
|
||||
textarea
|
||||
font-size: 0.7rem
|
||||
background: url(/img/comment_bg.png) 100% 100% no-repeat
|
||||
|
||||
.info
|
||||
display: none
|
||||
|
||||
.vcomment
|
||||
margin-top: 20px
|
||||
|
||||
.vimg
|
||||
border: 0
|
||||
|
||||
&:hover
|
||||
-moz-transform: rotate(540deg)
|
||||
-o-transform: rotate(540deg)
|
||||
-webkit-transform: rotate(540deg)
|
||||
transform: rotate(540deg)
|
||||
.vcount
|
||||
font-size: 0.775rem
|
||||
|
||||
.vnum
|
||||
font-size: 1.1rem
|
||||
|
||||
.vnick
|
||||
font-size: 100%
|
||||
|
||||
.vsys
|
||||
font-size: 70%
|
||||
|
||||
.vtime
|
||||
font-size: .65rem
|
||||
|
||||
.vcontent
|
||||
font-size: 100%
|
||||
|
||||
.vat
|
||||
font-size: .7125rem;
|
||||
color: $cyan;
|
||||
border: 1px solid $cyan;
|
||||
padding: 0 .8rem;
|
||||
border-radius: 5px;
|
||||
|
||||
|
||||
#site-title, #site-sub-title,
|
||||
#site-name,
|
||||
#aside_content .author-info__name,
|
||||
#aside_content .author-info__description
|
||||
font-family: 'Titillium Web',Lato,PingFang SC, Hiragino Sans GB, "Microsoft JhengHei", "Microsoft YaHei", Helvetica Neue, Helvetica, Arial, sans-serif
|
||||
|
||||
|
||||
|
||||
#rightside
|
||||
right: -38px
|
||||
z-index: 100
|
||||
position: fixed
|
||||
bottom: 50px
|
||||
padding-bottom: 32px
|
||||
opacity: 0
|
||||
transition: all .2s
|
||||
|
||||
.translate_chn_to_cht
|
||||
width: 30px
|
||||
height: 30px
|
||||
background-color: #49b1f5
|
||||
color: #e3e8ee
|
||||
text-align: center
|
||||
line-height: 29px
|
||||
font-size: 16px
|
||||
display: block
|
||||
margin-bottom: 2px
|
||||
cursor: pointer
|
||||
text-decoration: none
|
||||
|
||||
.nightshift
|
||||
width: 30px
|
||||
height: 30px
|
||||
background-color: #49b1f5
|
||||
color: #e3e8ee
|
||||
text-align: center
|
||||
font-size: 17px
|
||||
display: block
|
||||
margin-bottom: 2px
|
||||
cursor: pointer
|
||||
padding-top: 6px
|
||||
|
||||
#to_comment
|
||||
width: 30px
|
||||
height: 30px
|
||||
background-color: #49b1f5
|
||||
color: #e3e8ee
|
||||
text-align: center
|
||||
font-size: 17px
|
||||
display: block
|
||||
margin-bottom: 2px
|
||||
cursor: pointer
|
||||
padding-top: 6px
|
||||
|
||||
a
|
||||
&:hover
|
||||
color: white
|
||||
&:after
|
||||
color: white
|
||||
|
||||
|
||||
|
||||
.comment_headling
|
||||
font-size: 20px
|
||||
font-weight: 700
|
||||
margin-bottom: 10px
|
||||
|
||||
|
||||
// bookmark 樣式
|
||||
.fc-container .fancybox-bg {
|
||||
background: #eee;
|
||||
}
|
||||
|
||||
.fancybox-is-open.fc-container .fancybox-bg {
|
||||
opacity: 0.95;
|
||||
}
|
||||
|
||||
.fc-content {
|
||||
margin: 20px;
|
||||
max-width: 550px;
|
||||
padding: 50px;
|
||||
box-shadow: 10px 10px 60px -25px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.fc-content h3 {
|
||||
margin-top: 0;
|
||||
font-size: 1.6em;
|
||||
letter-spacing: normal;
|
||||
}
|
||||
|
||||
.fc-content p {
|
||||
color: #666;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.fc-content p:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
/* Custom animation */
|
||||
.fancybox-fx-material.fancybox-slide--previous,
|
||||
.fancybox-fx-material.fancybox-slide--next {
|
||||
transform: translateY(-60px) scale(1.1);
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.fancybox-fx-material.fancybox-slide--current {
|
||||
opacity: 1;
|
||||
transform: translateY(0) scale(1);
|
||||
}
|
||||
|
||||
.bookmark-ok
|
||||
background: #FF6666;
|
||||
border-width: 0;
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
padding: 7px 20px;
|
||||
line-height: 1.5;
|
||||
border-radius: 20px;
|
||||
text-transform: uppercase;
|
||||
font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif;
|
||||
font-size: 80%;
|
||||
font-weight: 700;
|
||||
margin: 5px 5px 5px 0;
|
||||
display: inline-block;
|
||||
cursor: pointer;
|
||||
outline: none;
|
||||
transition: all .2s ease-in-out;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
|
||||
.tright
|
||||
text-align: right
|
||||
|
||||
|
||||
|
||||
|
||||
8
source/css/_highlight/diff.styl
Normal file
8
source/css/_highlight/diff.styl
Normal file
@@ -0,0 +1,8 @@
|
||||
$highlight_theme = hexo-config('highlight_theme')
|
||||
|
||||
if $highlight_theme == 'light'
|
||||
$highlight-deletion = #fdd
|
||||
$highlight-addition = #dfd
|
||||
else
|
||||
$highlight-deletion = #008000
|
||||
$highlight-addition = #800000
|
||||
303
source/css/_highlight/highlight.styl
Normal file
303
source/css/_highlight/highlight.styl
Normal file
@@ -0,0 +1,303 @@
|
||||
// https://github.com/equinusocio/vsc-material-theme
|
||||
@require "theme"
|
||||
@require "diff"
|
||||
|
||||
languages = "js" "javascript" "python" "ruby" "xml" "html" "css" "perl" "sql" "coffeescript" "java" "scala" "kotlin" "c" "c\+\+" "go" "less" "sass" "scss" "stylus" "styl" "typescript" "ts" "bash" "yml" "gradle" "groovy" "ejs" "swig"
|
||||
wordWrap = !hexo-config("rootConfig.highlight.line_number") && hexo-config("code_word_wrap")
|
||||
|
||||
loopForLanguages()
|
||||
for lang in languages
|
||||
.article-container
|
||||
figure.highlight
|
||||
&{"." + lang}
|
||||
table
|
||||
&:before
|
||||
content: lang
|
||||
|
||||
loopForLanguages()
|
||||
|
||||
// Placeholder: $code-block
|
||||
$code-block
|
||||
overflow: auto
|
||||
margin: 1rem 0
|
||||
padding: 0
|
||||
padding-top: 1.4rem
|
||||
background: $highlight-background
|
||||
color: $highlight-foreground
|
||||
font-size: $code-font-size
|
||||
line-height: $line-height-code-block
|
||||
|
||||
if wordWrap
|
||||
counter-reset: line
|
||||
white-space: pre-wrap
|
||||
|
||||
figure.highlight
|
||||
position: relative
|
||||
|
||||
blockquote
|
||||
margin: 0
|
||||
padding: 0.1rem 0.8rem
|
||||
border-left: 0.2rem solid $blockquote-padding-color
|
||||
color: $blockquote-color
|
||||
background-color: $blockquote-background-color
|
||||
|
||||
.article-container
|
||||
pre,
|
||||
code
|
||||
font-family: $code-font !important
|
||||
|
||||
code
|
||||
padding: 0.1rem 0.2rem
|
||||
background: $code-background
|
||||
color: $code-foreground
|
||||
word-wrap: break-word
|
||||
font-size: $code-font-size
|
||||
|
||||
pre
|
||||
@extend $code-block
|
||||
|
||||
code
|
||||
padding: 0
|
||||
background: none
|
||||
color: $highlight-foreground
|
||||
text-shadow: none
|
||||
|
||||
.highlight
|
||||
@extend $code-block
|
||||
position: relative
|
||||
border-radius: 1px
|
||||
|
||||
&:after
|
||||
position: absolute
|
||||
top: 0
|
||||
z-index: 0
|
||||
min-width: 100%
|
||||
height: 1.4rem
|
||||
background: darken($highlight-background, 5)
|
||||
content: ""
|
||||
|
||||
pre
|
||||
margin: 0
|
||||
padding: 8px 0
|
||||
border: none
|
||||
|
||||
.line
|
||||
&::selection
|
||||
background: $highlight-selection
|
||||
color: $highlight-foreground
|
||||
|
||||
if wordWrap
|
||||
&:before
|
||||
display: inline-block
|
||||
padding: 0 0.3rem 0 0
|
||||
min-width: 1.6rem
|
||||
color: $highlight-gutter.color
|
||||
content: counter(line)
|
||||
counter-increment: line
|
||||
text-align: left
|
||||
|
||||
table
|
||||
position: relative
|
||||
margin: 0
|
||||
width: auto
|
||||
border: none
|
||||
|
||||
&:before
|
||||
position: absolute
|
||||
z-index: 1
|
||||
display: inline-block
|
||||
margin-top: -1.4rem
|
||||
padding: 0 0.7rem
|
||||
width: 5rem
|
||||
color: $highlight-foreground
|
||||
content: "Code"
|
||||
font-weight: bold
|
||||
font-size: 0.8rem
|
||||
line-height: 1.4rem
|
||||
|
||||
&:after
|
||||
position: absolute
|
||||
top: -1.4rem
|
||||
z-index: 0
|
||||
width: 100%
|
||||
height: 1.4rem
|
||||
background: darken($highlight-background, 5)
|
||||
content: ""
|
||||
|
||||
td
|
||||
padding: 0
|
||||
border: none
|
||||
|
||||
figcaption
|
||||
clearfix()
|
||||
position: absolute
|
||||
z-index: 1
|
||||
margin-bottom: 1em
|
||||
padding: 0.2em 0 0.2em 0.7rem
|
||||
width: 100%
|
||||
height: 1.4em
|
||||
color: $highlight-foreground
|
||||
font-size: 1em
|
||||
line-height: 1em
|
||||
|
||||
span
|
||||
float: left
|
||||
overflow: hidden
|
||||
max-width: 100%
|
||||
text-overflow: ellipsis
|
||||
white-space: nowrap
|
||||
|
||||
a
|
||||
float: right
|
||||
padding-right: 10px
|
||||
color: $highlight-foreground
|
||||
|
||||
&:hover
|
||||
border-bottom-color: $highlight-foreground
|
||||
|
||||
&+table
|
||||
margin-top: 1em
|
||||
|
||||
&:before
|
||||
margin-top: -2.1rem
|
||||
|
||||
&:after
|
||||
top: -2.1rem
|
||||
|
||||
.gutter pre
|
||||
padding-right: 0.5rem
|
||||
padding-left: 0.5rem
|
||||
background-color: $highlight-gutter.bg-color
|
||||
color: $highlight-gutter.color
|
||||
text-align: right
|
||||
|
||||
.code pre
|
||||
padding-right: 0.5rem
|
||||
padding-left: 0.5rem
|
||||
width: 100%
|
||||
background-color: $highlight-background
|
||||
|
||||
.line
|
||||
height: 1rem
|
||||
|
||||
.gutter
|
||||
user-select: none
|
||||
-webkit-user-select: none
|
||||
-moz-user-select: none
|
||||
-ms-user-select: none
|
||||
|
||||
.gist table
|
||||
width: auto
|
||||
|
||||
td
|
||||
border: none
|
||||
|
||||
// For diff highlight
|
||||
pre .deletion
|
||||
background: $highlight-deletion
|
||||
|
||||
pre .addition
|
||||
background: $highlight-addition
|
||||
|
||||
pre .meta
|
||||
color: $highlight-purple
|
||||
|
||||
pre
|
||||
.comment
|
||||
color: $highlight-comment
|
||||
|
||||
&::selection
|
||||
background: $highlight-selection
|
||||
color: $highlight-foreground
|
||||
|
||||
.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
|
||||
|
||||
&::selection
|
||||
background: $highlight-selection
|
||||
color: $highlight-foreground
|
||||
|
||||
.tag
|
||||
color: $highlight-aqua
|
||||
|
||||
&::selection
|
||||
background: $highlight-selection
|
||||
color: $highlight-foreground
|
||||
|
||||
.number,
|
||||
.preprocessor,
|
||||
.literal,
|
||||
.params,
|
||||
.constant,
|
||||
.command
|
||||
color: $highlight-orange
|
||||
|
||||
&::selection
|
||||
background: $highlight-selection
|
||||
color: $highlight-foreground
|
||||
|
||||
.built_in
|
||||
color: $highlight-yellow
|
||||
|
||||
&::selection
|
||||
background: $highlight-selection
|
||||
color: $highlight-foreground
|
||||
|
||||
.ruby .class .title,
|
||||
.css .rules .attribute,
|
||||
.string,
|
||||
.value,
|
||||
.inheritance,
|
||||
.header,
|
||||
.ruby .symbol,
|
||||
.xml .cdata,
|
||||
.special,
|
||||
.number,
|
||||
.formula
|
||||
color: $highlight-green
|
||||
|
||||
&::selection
|
||||
background: $highlight-selection
|
||||
color: $highlight-foreground
|
||||
|
||||
.keyword,
|
||||
.title,
|
||||
.css .hexcolor
|
||||
color: $highlight-aqua
|
||||
|
||||
&::selection
|
||||
background: $highlight-selection
|
||||
color: $highlight-foreground
|
||||
|
||||
.function,
|
||||
.python .decorator,
|
||||
.python .title,
|
||||
.ruby .function .title,
|
||||
.ruby .title .keyword,
|
||||
.perl .sub,
|
||||
.javascript .title,
|
||||
.coffeescript .title
|
||||
color: $highlight-blue
|
||||
|
||||
&::selection
|
||||
background: $highlight-selection
|
||||
color: $highlight-foreground
|
||||
|
||||
.tag .attr,
|
||||
.javascript .function
|
||||
color: $highlight-purple
|
||||
|
||||
&::selection
|
||||
background: $highlight-selection
|
||||
color: $highlight-foreground
|
||||
91
source/css/_highlight/theme.styl
Normal file
91
source/css/_highlight/theme.styl
Normal file
@@ -0,0 +1,91 @@
|
||||
$highlight_theme = hexo-config("highlight_theme")
|
||||
|
||||
if $highlight_theme == "default"
|
||||
$highlight-background = #263238
|
||||
$highlight-current-line = #efefef
|
||||
$highlight-selection = #80CBC420
|
||||
$highlight-foreground = #EEFFFF
|
||||
$highlight-comment = #546E7A
|
||||
$highlight-red = #FF5370
|
||||
$highlight-orange = #F78C6C
|
||||
$highlight-yellow = #FFCB6B
|
||||
$highlight-green = #C3E88D
|
||||
$highlight-aqua = #89DDFF
|
||||
$highlight-blue = #82AAFF
|
||||
$highlight-purple = #C792EA
|
||||
$highlight-gutter = {
|
||||
color: #37474F,
|
||||
bg-color: $highlight-background
|
||||
}
|
||||
|
||||
if $highlight_theme == "darker"
|
||||
$highlight-background = #212121
|
||||
$highlight-current-line = #282a2e
|
||||
$highlight-selection = #61616150
|
||||
$highlight-foreground = #EEFFFF
|
||||
$highlight-comment = #4A4A4A
|
||||
$highlight-red = #FF5370
|
||||
$highlight-orange = #F78C6C
|
||||
$highlight-yellow = #FFCB6B
|
||||
$highlight-green = #C3E88D
|
||||
$highlight-aqua = #89DDFF
|
||||
$highlight-blue = #82AAFF
|
||||
$highlight-purple = #C792EA
|
||||
$highlight-gutter = {
|
||||
color: #424242,
|
||||
bg-color: $highlight-background
|
||||
}
|
||||
|
||||
if $highlight_theme == "pale night"
|
||||
$highlight-background = #292D3E
|
||||
$highlight-current-line = #393939
|
||||
$highlight-selection = #717CB450
|
||||
$highlight-foreground = #A6ACCD
|
||||
$highlight-comment = #676E95
|
||||
$highlight-red = #FF5370
|
||||
$highlight-orange = #F78C6C
|
||||
$highlight-yellow = #FFCB6B
|
||||
$highlight-green = #C3E88D
|
||||
$highlight-aqua = #89DDFF
|
||||
$highlight-blue = #82AAFF
|
||||
$highlight-purple = #C792EA
|
||||
$highlight-gutter = {
|
||||
color: #3A3F58,
|
||||
bg-color: $highlight-background
|
||||
}
|
||||
|
||||
if $highlight_theme == "ocean"
|
||||
$highlight-background = #0F111A
|
||||
$highlight-current-line = #000000
|
||||
$highlight-selection = #717CB450
|
||||
$highlight-foreground = #8F93A2
|
||||
$highlight-comment = #464B5D
|
||||
$highlight-red = #FF5370
|
||||
$highlight-orange = #F78C6C
|
||||
$highlight-yellow = #FFCB6B
|
||||
$highlight-green = #C3E88D
|
||||
$highlight-aqua = #89DDFF
|
||||
$highlight-blue = #82AAFF
|
||||
$highlight-purple = #C792EA
|
||||
$highlight-gutter = {
|
||||
color: #3B3F5180,
|
||||
bg-color: $highlight-background
|
||||
}
|
||||
|
||||
if $highlight_theme == "light"
|
||||
$highlight-background = #F6F8FA
|
||||
$highlight-current-line = #00346e
|
||||
$highlight-selection = #80CBC440
|
||||
$highlight-foreground = #90A4AE
|
||||
$highlight-comment = #90A4AE90
|
||||
$highlight-red = #E53935
|
||||
$highlight-orange = #F76D47
|
||||
$highlight-yellow = #FFB62C
|
||||
$highlight-green = #91B859
|
||||
$highlight-aqua = #39ADB5
|
||||
$highlight-blue = #6182B8
|
||||
$highlight-purple = #7C4DFF
|
||||
$highlight-gutter = {
|
||||
color: #CFD8DC,
|
||||
bg-color: $highlight-background
|
||||
}
|
||||
292
source/css/_layout/aside.styl
Normal file
292
source/css/_layout/aside.styl
Normal file
@@ -0,0 +1,292 @@
|
||||
#aside_content
|
||||
width: 25%
|
||||
|
||||
.card_widget
|
||||
-webkit-box-shadow: 0 4px 8px 6px rgba(7,17,27,.06)
|
||||
box-shadow: 0 4px 8px 6px rgba(7,17,27,.06)
|
||||
border-radius: 8px
|
||||
-webkit-transition: all .3s
|
||||
-moz-transition: all .3s
|
||||
-o-transition: all .3s
|
||||
-ms-transition: all .3s
|
||||
transition: all .3s
|
||||
background: #fff
|
||||
margin-top: 20px
|
||||
margin-left: 15px
|
||||
overflow: hidden
|
||||
|
||||
&:hover
|
||||
-webkit-box-shadow: 0 4px 12px 12px rgba(7,17,27,0.15)
|
||||
box-shadow: 0 4px 12px 12px rgba(7,17,27,0.15)
|
||||
|
||||
.card-author
|
||||
img
|
||||
height: 128px
|
||||
width: 128px
|
||||
display: inline-block
|
||||
vertical-align: top
|
||||
border-radius: 70px
|
||||
transition: all .3s
|
||||
|
||||
&:hover
|
||||
-moz-transform: rotate(540deg)
|
||||
-o-transform: rotate(540deg)
|
||||
-webkit-transform: rotate(540deg)
|
||||
transform: rotate(540deg)
|
||||
.author-info
|
||||
&__name
|
||||
font-size: 1.1rem
|
||||
display: block
|
||||
margin: -0.1rem auto
|
||||
font-weight: 500
|
||||
|
||||
&__description
|
||||
display: block
|
||||
margin: -0.1rem auto
|
||||
|
||||
.data_link
|
||||
a
|
||||
text-decoration: none
|
||||
|
||||
.length_num
|
||||
font-size: 1rem
|
||||
color: #000
|
||||
|
||||
.headline
|
||||
display: block
|
||||
font-size: 0.7rem
|
||||
letter-spacing: 1px
|
||||
margin-bottom: -21px
|
||||
text-transform: uppercase
|
||||
color:#4c4948
|
||||
|
||||
#aside-social-icons
|
||||
margin: 0.5rem auto -0.7rem
|
||||
width: 15rem
|
||||
text-align: center
|
||||
|
||||
.social-icon
|
||||
margin: 0 0.5rem
|
||||
color: #4c4948
|
||||
/* text-shadow: 0.1rem 0.1rem 0.2rem rgba(0,0,0,0.15) */
|
||||
font-size: 1rem
|
||||
cursor: pointer
|
||||
|
||||
i
|
||||
transition: all 0.3s
|
||||
|
||||
&:hover
|
||||
-moz-transform: rotate(540deg)
|
||||
-o-transform: rotate(540deg)
|
||||
-webkit-transform: rotate(540deg)
|
||||
transform: rotate(540deg)
|
||||
|
||||
|
||||
a#bookmark-it
|
||||
display: inline-block
|
||||
margin-top: .2rem
|
||||
padding: 0 1rem
|
||||
height: 1.6rem
|
||||
background: #49b1f5
|
||||
color: #fff
|
||||
text-decoration: none
|
||||
line-height: 1.6rem
|
||||
position: relative
|
||||
text-transform: uppercase
|
||||
z-index: 1
|
||||
|
||||
.toggle_change--primary,.bookmark--primary
|
||||
color: $cyan
|
||||
|
||||
.toggle_change--animated,.bookmark--animated
|
||||
transition-property: color
|
||||
transition-duration: 1s
|
||||
|
||||
&:before {
|
||||
content: ""
|
||||
position: absolute
|
||||
top: 0
|
||||
left: 0
|
||||
right: 0
|
||||
bottom: 0
|
||||
background: $cyan
|
||||
transform: scaleX(0)
|
||||
transform-origin: 0 50%
|
||||
transition-property: transform
|
||||
transition-duration: 0.5s
|
||||
transition-timing-function: ease-out
|
||||
z-index: -1
|
||||
}
|
||||
|
||||
&:hover {
|
||||
color: white
|
||||
|
||||
&:before {
|
||||
transform: scaleX(1)
|
||||
transition-timing-function: cubic-bezier(0.45, 1.64, 0.47, 0.66)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
.card-content
|
||||
padding: 1rem 1.2rem
|
||||
|
||||
.post_data
|
||||
display: flex
|
||||
|
||||
.data-item
|
||||
flex-grow: 1
|
||||
align-items: center
|
||||
flex-basis: auto
|
||||
justify-content: center
|
||||
|
||||
|
||||
.item_headline
|
||||
font-size: 0.8rem
|
||||
|
||||
span
|
||||
margin-left: 10px
|
||||
|
||||
.card-tag-cloud a
|
||||
text-decoration: none
|
||||
position: relative
|
||||
padding-bottom: 0.3rem
|
||||
word-break: keep-all
|
||||
|
||||
&::after
|
||||
position: absolute
|
||||
bottom: 0
|
||||
left: 0
|
||||
z-index: -1
|
||||
width: 0
|
||||
height: 3px
|
||||
background-color: lighten($theme-color, 30%)
|
||||
content: ""
|
||||
transition: all 0.3s ease-in-out
|
||||
|
||||
&:hover
|
||||
color: $light-blue !important
|
||||
|
||||
&::after
|
||||
width: 100%
|
||||
|
||||
|
||||
|
||||
.aside_recent_item
|
||||
margin: 10px 0 -15px 0
|
||||
|
||||
.aside_recent_post
|
||||
a
|
||||
text-decoration: none
|
||||
color: #4c4948
|
||||
|
||||
.aside_recent_post
|
||||
margin-bottom: 10px
|
||||
width: 100%
|
||||
|
||||
.aside_post_cover
|
||||
height: 70px
|
||||
width: 70px
|
||||
float: left
|
||||
.aside_post_bg
|
||||
object-fit: cover
|
||||
width: 100%
|
||||
height: 100%
|
||||
max-width: 100%
|
||||
|
||||
&:hover
|
||||
box-shadow: none
|
||||
|
||||
#aside_title
|
||||
padding-top: 4px
|
||||
|
||||
.aside_post_meta
|
||||
font-size: 0.6rem
|
||||
padding-left: 5px
|
||||
|
||||
.aside_post_title
|
||||
line-height: 1rem
|
||||
display: -webkit-box
|
||||
-webkit-line-clamp: 2
|
||||
-webkit-box-orient: vertical
|
||||
overflow: hidden
|
||||
height: 41px
|
||||
padding-left: 5px
|
||||
|
||||
&:hover
|
||||
color: $light-blue !important
|
||||
|
||||
|
||||
|
||||
.aside_category_item,.archive-list
|
||||
list-style: none
|
||||
margin-bottom: -3px
|
||||
margin-block-start: 0.2rem
|
||||
|
||||
.aside_category_list,.archive-list-item
|
||||
margin-left: -40px
|
||||
padding: 0.2rem 1rem
|
||||
|
||||
&:hover
|
||||
background-color: $light-blue
|
||||
color: #363636
|
||||
a
|
||||
text-decoration: none
|
||||
color: #4c4948
|
||||
|
||||
.aside_category_list_length,.archive-list-count
|
||||
float: right
|
||||
|
||||
.card-archives
|
||||
margin-bottom: 20px
|
||||
|
||||
.card-announcement-animation
|
||||
animation: announ_animation 1.5s infinite
|
||||
|
||||
.card-webinfo
|
||||
.webinfo
|
||||
padding: 0.2rem 1rem
|
||||
|
||||
.webinfo_item
|
||||
display: block
|
||||
padding: 4px 0 0
|
||||
|
||||
.webinfo_article_name,
|
||||
.webinfo_runtime_name,
|
||||
.webinfo_site_uv_name,
|
||||
.webinfo_site_name
|
||||
display: inline-block
|
||||
|
||||
.webinfo_article_count,
|
||||
.webinfo_runtime_count,
|
||||
.webinfo_site_uv_count,
|
||||
.webinfo_site_pv_count
|
||||
float: right
|
||||
display: inline-block
|
||||
|
||||
|
||||
@keyframes announ_animation{
|
||||
|
||||
0%,to{
|
||||
color: #4c4948
|
||||
|
||||
}
|
||||
50%{
|
||||
color: #FF0000
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@media screen and (max-width: 900px)
|
||||
.layout_page
|
||||
flex-direction: column
|
||||
|
||||
#recent-posts,#aside_content
|
||||
width: 100% !important
|
||||
|
||||
.card_widget
|
||||
margin-left: 0 !important
|
||||
|
||||
|
||||
64
source/css/_layout/category.styl
Normal file
64
source/css/_layout/category.styl
Normal file
@@ -0,0 +1,64 @@
|
||||
.category-content
|
||||
ol,
|
||||
ul
|
||||
margin-top: 0.4rem
|
||||
padding: 0 0 0 0.8rem
|
||||
list-style: none
|
||||
counter-reset: li
|
||||
|
||||
p
|
||||
margin: 0
|
||||
|
||||
ol,
|
||||
ul
|
||||
padding-left: 0.5rem
|
||||
|
||||
li
|
||||
position: relative
|
||||
margin: 0.3rem 0
|
||||
// padding-left: 0.3rem
|
||||
padding: 0.1rem 0.5rem 0.1rem 1.5rem !important
|
||||
|
||||
&:hover
|
||||
&:before
|
||||
transform: rotate(360deg)
|
||||
|
||||
&:before
|
||||
position: absolute
|
||||
top: 0
|
||||
left: 0
|
||||
background: $light-blue
|
||||
color: $white
|
||||
cursor: pointer
|
||||
transition: all 0.3s ease-out
|
||||
|
||||
ol
|
||||
li
|
||||
&:before
|
||||
margin-top: 0.2rem
|
||||
width: w = 1.2rem
|
||||
height: h = w
|
||||
border-radius: 0.5 * w
|
||||
content: counter(li)
|
||||
counter-increment: li
|
||||
text-align: center
|
||||
font-size: 0.6rem
|
||||
line-height: h
|
||||
|
||||
ul
|
||||
li
|
||||
&:hover
|
||||
&:before
|
||||
border-color: $ruby
|
||||
|
||||
&:before
|
||||
$w = 0.3rem
|
||||
top: 10px
|
||||
margin-left: 0.45rem
|
||||
width: w = $w
|
||||
height: h = w
|
||||
border: 0.5 * w solid $light-blue
|
||||
border-radius: w
|
||||
background: $white
|
||||
content: ""
|
||||
line-height: h
|
||||
2
source/css/_layout/comments.styl
Normal file
2
source/css/_layout/comments.styl
Normal file
@@ -0,0 +1,2 @@
|
||||
#disqus_thread
|
||||
margin-top: 1rem
|
||||
34
source/css/_layout/footer.styl
Normal file
34
source/css/_layout/footer.styl
Normal file
@@ -0,0 +1,34 @@
|
||||
footer
|
||||
$bg-svg += ""
|
||||
margin-top: 1rem
|
||||
background: $light-blue
|
||||
// background-image: url($bg-svg)
|
||||
background-attachment: local
|
||||
|
||||
&.footer-bg
|
||||
background-position: bottom
|
||||
background-size: cover
|
||||
|
||||
|
||||
#footer
|
||||
padding: 1.2rem 1rem 1rem
|
||||
color: $light-grey
|
||||
text-align: center
|
||||
|
||||
a
|
||||
color: $light-grey
|
||||
text-decoration: none
|
||||
cursor: pointer
|
||||
|
||||
&:hover
|
||||
color: $white
|
||||
|
||||
.footer-separator
|
||||
margin: 0 0.2rem
|
||||
|
||||
#busuanzi
|
||||
&_value
|
||||
&_site_uv,
|
||||
&_site_pv,
|
||||
&_page_pv
|
||||
margin-left: 0.2rem
|
||||
236
source/css/_layout/head.styl
Normal file
236
source/css/_layout/head.styl
Normal file
@@ -0,0 +1,236 @@
|
||||
#nav
|
||||
position: relative
|
||||
margin-bottom: 1rem
|
||||
background-color: $light-blue
|
||||
background-position: center
|
||||
background-size: cover
|
||||
|
||||
|
||||
&.full_page
|
||||
background-attachment: local
|
||||
height: 100vh
|
||||
|
||||
&.bg_local
|
||||
background-attachment: local
|
||||
|
||||
|
||||
&.no-bg
|
||||
$bg-svg += ""
|
||||
background-image: url($bg-svg) !important
|
||||
background-size: initial
|
||||
|
||||
#site-social-icons
|
||||
margin: 0 auto
|
||||
width: 15rem
|
||||
text-align: center
|
||||
display: none
|
||||
|
||||
.social-icon
|
||||
margin: 0 0.5rem
|
||||
color: $light-grey
|
||||
text-shadow: 0.1rem 0.1rem 0.2rem rgba(0, 0, 0, 0.15)
|
||||
font-size: .9rem
|
||||
cursor: pointer
|
||||
|
||||
&:hover
|
||||
color: $white
|
||||
|
||||
#site-info
|
||||
position: absolute
|
||||
width: 100%
|
||||
top: 43%
|
||||
|
||||
#site-title,
|
||||
#site-sub-title
|
||||
color: $light-grey
|
||||
text-align: center
|
||||
text-shadow: 0.1rem 0.1rem 0.2rem rgba(0, 0, 0, 0.15)
|
||||
line-height: 1.5
|
||||
|
||||
#site-title
|
||||
font-weight: bold
|
||||
font-size: 1.3rem
|
||||
|
||||
#site-sub-title
|
||||
font-size: 0.8rem
|
||||
|
||||
.scroll-down
|
||||
position: absolute
|
||||
bottom: 0
|
||||
width: 100%
|
||||
cursor: pointer
|
||||
height: 42px
|
||||
font-size: 30px
|
||||
text-align: center
|
||||
|
||||
|
||||
#page-header
|
||||
position: absolute
|
||||
top: 0
|
||||
z-index: 99
|
||||
padding: 10px 36px
|
||||
width: 100%
|
||||
border: none
|
||||
font-size: 18px
|
||||
transition: all 0.2s ease-in-out
|
||||
|
||||
.toggle-menu
|
||||
display: none
|
||||
padding-top: 0.6rem
|
||||
color: $light-grey
|
||||
cursor: pointer
|
||||
transition: all 0.2s ease-in-out
|
||||
|
||||
&:hover
|
||||
color: $white
|
||||
|
||||
.menu-icon-first,
|
||||
.menu-icon-second,
|
||||
.menu-icon-third
|
||||
width: 18px
|
||||
height: 3px
|
||||
background-color: #eee
|
||||
margin: 2px 0
|
||||
transition: 0.4s
|
||||
|
||||
&.close
|
||||
/* 旋转第一条横线 */
|
||||
.menu-icon-first
|
||||
-webkit-transform: rotate(45deg) translate(4px, 3px)
|
||||
transform: rotate(45deg) translate(4px, 3px)
|
||||
|
||||
/* 隐藏第二条横线 */
|
||||
.menu-icon-second
|
||||
opacity: 0
|
||||
|
||||
/* 旋转第三条横线 */
|
||||
.menu-icon-third
|
||||
-webkit-transform: rotate(-45deg) translate(4px, -4px)
|
||||
transform: rotate(-45deg) translate(4px, -4px)
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
a
|
||||
color: $light-grey
|
||||
text-decoration: none
|
||||
|
||||
&:hover
|
||||
color: $white
|
||||
|
||||
.site-page
|
||||
position: relative
|
||||
margin-left: 0.6rem
|
||||
padding-bottom: 0.3rem
|
||||
text-shadow: 0.05rem 0.05rem 0.1rem rgba(0, 0, 0, 0.3)
|
||||
font-size: 0.7rem
|
||||
cursor: pointer
|
||||
|
||||
&::after
|
||||
position: absolute
|
||||
bottom: 0
|
||||
left: 0
|
||||
z-index: -1
|
||||
width: 0
|
||||
height: 3px
|
||||
background-color: lighten($theme-color, 30%)
|
||||
content: ""
|
||||
transition: all 0.3s ease-in-out
|
||||
|
||||
&:hover
|
||||
&::after
|
||||
width: 100%
|
||||
|
||||
&.fixed
|
||||
position: fixed
|
||||
top: -60px
|
||||
z-index: 101
|
||||
background: alpha($white, 0.8)
|
||||
box-shadow: 0 5px 6px -5px alpha($grey, 0.6)
|
||||
transition: transform 0.2s ease-in-out, opacity 0.2s ease-in-out
|
||||
|
||||
&.open-sidebar
|
||||
.site-page
|
||||
display: none
|
||||
opacity: 0
|
||||
|
||||
a,
|
||||
#site-name
|
||||
color: $light-black
|
||||
text-shadow: none
|
||||
|
||||
.menu-icon-first,
|
||||
.menu-icon-second,
|
||||
.menu-icon-third
|
||||
background-color: $light-black
|
||||
text-shadow: none
|
||||
|
||||
|
||||
&a,#site-name
|
||||
&:hover
|
||||
color: $light-blue
|
||||
|
||||
&.visible
|
||||
transform: translate3d(0, 100%, 0)
|
||||
|
||||
#site-name
|
||||
text-shadow: 0.1rem 0.1rem 0.2rem rgba(0, 0, 0, 0.15)
|
||||
font-weight: bold
|
||||
cursor: pointer
|
||||
|
||||
@media screen and (min-width: $sm)
|
||||
#site-title
|
||||
font-size: 2rem
|
||||
|
||||
#site-sub-title
|
||||
font-size: 1.2rem
|
||||
|
||||
@media screen and (max-width: $sm)
|
||||
|
||||
#page-header
|
||||
padding: 10px 0.8rem
|
||||
|
||||
.toggle-menu
|
||||
display: block
|
||||
|
||||
.menus
|
||||
position: absolute
|
||||
top: 3rem
|
||||
right: 0.8rem
|
||||
display: none
|
||||
width: 8rem
|
||||
background: alpha($white, 0.9)
|
||||
cursor: pointer
|
||||
box-shadow: 0 0 4px rgba(0, 0, 0, 0.27)
|
||||
|
||||
a
|
||||
display: block !important
|
||||
opacity: 1 !important
|
||||
margin-left: 0
|
||||
padding-top: 0.3rem
|
||||
padding-bottom: 0.3rem
|
||||
padding-left: 0.6rem
|
||||
color: $font-black
|
||||
text-shadow: none
|
||||
font-size: 0.8rem
|
||||
z-index: 0
|
||||
|
||||
&:hover
|
||||
color: $light-blue
|
||||
|
||||
.search
|
||||
right: 0.5rem
|
||||
|
||||
span
|
||||
display none
|
||||
|
||||
&.fixed.open-sidebar
|
||||
.search
|
||||
display: inline-block;
|
||||
opacity: 1;
|
||||
|
||||
|
||||
#page-header .site-page
|
||||
margin-left: 1rem
|
||||
319
source/css/_layout/page.styl
Normal file
319
source/css/_layout/page.styl
Normal file
@@ -0,0 +1,319 @@
|
||||
galleryItemStyle(w, h)
|
||||
.gallery
|
||||
&-item
|
||||
width: w
|
||||
height: unit(h, "rem")
|
||||
|
||||
&__title
|
||||
transform: translate3d(0, unit(h, "rem"), 0)
|
||||
|
||||
&:hover
|
||||
.gallery-item__title
|
||||
transform: translate3d(0, unit(h - 1.5, "rem"), 0)
|
||||
|
||||
.recent-post-item
|
||||
.content
|
||||
margin-top: 0.5rem
|
||||
|
||||
p
|
||||
word-break: break-word
|
||||
|
||||
|
||||
ol,
|
||||
ul
|
||||
margin-top: 0.4rem
|
||||
padding: 0 0 0 0.8rem
|
||||
list-style: none
|
||||
counter-reset: li
|
||||
|
||||
p
|
||||
margin: 0
|
||||
|
||||
ol,
|
||||
ul
|
||||
padding-left: 0.5rem
|
||||
|
||||
li
|
||||
position: relative
|
||||
margin: 0.2rem 0
|
||||
padding: 0.1rem 0.5rem 0.1rem 1.5rem
|
||||
|
||||
&:hover
|
||||
&:before
|
||||
transform: rotate(360deg)
|
||||
|
||||
&:before
|
||||
position: absolute
|
||||
top: 0
|
||||
left: 0
|
||||
background: $light-blue
|
||||
color: $white
|
||||
cursor: pointer
|
||||
transition: all 0.3s ease-out
|
||||
|
||||
ol
|
||||
li
|
||||
&:before
|
||||
margin-top: 0.2rem
|
||||
width: w = 1.2rem
|
||||
height: h = w
|
||||
border-radius: 0.5 * w
|
||||
content: counter(li)
|
||||
counter-increment: li
|
||||
text-align: center
|
||||
font-size: 0.6rem
|
||||
line-height: h
|
||||
|
||||
ul
|
||||
li
|
||||
&:hover
|
||||
&:before
|
||||
border-color: $ruby
|
||||
|
||||
&:before
|
||||
$w = 0.3rem
|
||||
top: 10px
|
||||
margin-left: 0.45rem
|
||||
width: w = $w
|
||||
height: h = w
|
||||
border: 0.5 * w solid $light-blue
|
||||
border-radius: w
|
||||
background: $white
|
||||
content: ""
|
||||
line-height: h
|
||||
|
||||
.article-type
|
||||
margin-left: 0.3rem
|
||||
color: $grey
|
||||
|
||||
.article-meta
|
||||
color: $grey
|
||||
|
||||
.sticky
|
||||
color: $theme-button-hover-color
|
||||
|
||||
i
|
||||
margin: 0 0.2rem 0 0.3rem
|
||||
|
||||
&__separator
|
||||
margin-left: 0.3rem
|
||||
|
||||
.fa-angle-right,
|
||||
&__link
|
||||
margin: 0 0 0 0.3rem
|
||||
|
||||
time
|
||||
color: $grey
|
||||
|
||||
.more_setting
|
||||
display: none
|
||||
|
||||
.more
|
||||
display: inline-block
|
||||
padding: 0 1rem
|
||||
height: h = 1.6rem
|
||||
// background: $light-blue
|
||||
// color: $white
|
||||
text-align: center
|
||||
text-decoration: none
|
||||
line-height: h
|
||||
cursor: pointer
|
||||
// transition: all 0.2s ease-in-out
|
||||
|
||||
// &:hover
|
||||
// background: $ruby
|
||||
|
||||
.article-title
|
||||
margin-bottom: 0.3rem
|
||||
color: $black
|
||||
text-decoration: none
|
||||
font-size: 1.2rem
|
||||
cursor: pointer
|
||||
transition: all 0.2s ease-in-out
|
||||
line-height: 1.4
|
||||
text-overflow: ellipsis
|
||||
display: -webkit-box
|
||||
-webkit-box-orient: vertical
|
||||
-webkit-line-clamp: 2
|
||||
overflow: hidden
|
||||
word-wrap: break-word
|
||||
|
||||
&:hover
|
||||
// border-bottom: 1px solid $light-blue
|
||||
color: $light-blue !important
|
||||
|
||||
.tag-cloud
|
||||
padding: 1.5rem 1rem 2rem
|
||||
text-align: center
|
||||
|
||||
a
|
||||
display: inline-block
|
||||
margin: 0 0.4rem
|
||||
text-decoration: none
|
||||
cursor: pointer
|
||||
|
||||
&:hover
|
||||
color: $ruby !important
|
||||
|
||||
&__title
|
||||
font-size: 1.8rem
|
||||
|
||||
#tag,
|
||||
#category,
|
||||
#archive
|
||||
padding: 3rem 3rem 3rem
|
||||
|
||||
.article-sort
|
||||
padding-left: 1rem
|
||||
border-left: 2px solid $pale-blue
|
||||
|
||||
&-title
|
||||
position: relative
|
||||
padding-bottom: 1.2rem
|
||||
padding-left: 1rem
|
||||
font-size: 1.2rem
|
||||
line-height: 1
|
||||
|
||||
&:hover
|
||||
&:before
|
||||
border-color: $ruby
|
||||
|
||||
&:before
|
||||
position: absolute
|
||||
top: 0.25rem
|
||||
left: calc(-0.5rem + 1px)
|
||||
z-index: 1
|
||||
width: w = 0.5rem
|
||||
height: h = w
|
||||
border: 0.5 * w solid $light-blue
|
||||
border-radius: w
|
||||
background: $white
|
||||
content: ""
|
||||
line-height: h
|
||||
transition: all 0.2s ease-in-out
|
||||
|
||||
&:after
|
||||
position: absolute
|
||||
bottom: 0
|
||||
left: 0
|
||||
z-index: 0
|
||||
width: 0.1rem
|
||||
height: 1.3rem
|
||||
background: $pale-blue
|
||||
content: ""
|
||||
|
||||
&-item
|
||||
position: relative
|
||||
margin-bottom: 1rem
|
||||
transition: all 0.2s ease-in-out
|
||||
|
||||
&:hover
|
||||
&:before
|
||||
border-color: $ruby
|
||||
|
||||
&:before
|
||||
$w = 0.3rem
|
||||
position: absolute
|
||||
top: 0.48rem
|
||||
left: calc(-1rem - 7px)
|
||||
width: w = $w
|
||||
height: h = w
|
||||
border: 0.5 * w solid $light-blue
|
||||
border-radius: w
|
||||
background: $white
|
||||
content: ""
|
||||
line-height: h
|
||||
transition: all 0.2s ease-in-out
|
||||
|
||||
&.year
|
||||
font-size: 1rem
|
||||
|
||||
&:hover
|
||||
&:before
|
||||
border-color: $light-blue
|
||||
|
||||
&:before
|
||||
top: 0.7rem
|
||||
border-color: $ruby
|
||||
|
||||
&__time
|
||||
position: absolute
|
||||
top: 0.1rem
|
||||
color: $a-link-color
|
||||
|
||||
&__title
|
||||
display: block
|
||||
margin-left: 5rem
|
||||
color: $font-black
|
||||
text-decoration: none
|
||||
font-size: 0.8rem
|
||||
cursor: pointer
|
||||
|
||||
.category-lists
|
||||
padding: 1rem 0 1.5rem
|
||||
|
||||
.category__title
|
||||
text-align: center
|
||||
font-size: 1.8rem
|
||||
|
||||
.category-list
|
||||
a
|
||||
color: $font-black
|
||||
text-decoration: none
|
||||
cursor: pointer
|
||||
|
||||
.category-list-count
|
||||
margin-left: 0.4rem
|
||||
color: $a-link-color
|
||||
|
||||
&:before
|
||||
content: "("
|
||||
|
||||
&:after
|
||||
content: ")"
|
||||
|
||||
.gallery
|
||||
&-item
|
||||
position: relative
|
||||
display: inline-block
|
||||
overflow: hidden
|
||||
margin: 0.4rem
|
||||
width: 6rem
|
||||
height: 6rem
|
||||
background-position: 50% 50%
|
||||
background-size: cover
|
||||
background-repeat: no-repeat
|
||||
cursor: pointer
|
||||
transition: all 0.2s ease-in-out
|
||||
|
||||
&__title
|
||||
position: absolute
|
||||
overflow: hidden
|
||||
padding: 0 0.4rem
|
||||
width: 100%
|
||||
height: 1.5rem
|
||||
background: rgba(0, 0, 0, 0.5)
|
||||
color: $pale-blue
|
||||
text-align: center
|
||||
text-overflow: ellipsis
|
||||
white-space: nowrap
|
||||
line-height: 1.5rem
|
||||
transition: 0.2s ease-in-out
|
||||
transform: translate3d(0, 6rem, 0)
|
||||
|
||||
&:hover
|
||||
.gallery-item__title
|
||||
transform: translate3d(0, 4.5rem, 0)
|
||||
|
||||
@media screen and (max-width: $sm)
|
||||
.recent-post-item
|
||||
.article-title
|
||||
font-size: 1rem
|
||||
|
||||
.article-meta.tags
|
||||
display: none
|
||||
|
||||
galleryItemStyle(calc(50% - 22px), 6)
|
||||
|
||||
@media screen and (min-width: $md)
|
||||
galleryItemStyle(8rem, 8)
|
||||
114
source/css/_layout/pagination.styl
Normal file
114
source/css/_layout/pagination.styl
Normal file
@@ -0,0 +1,114 @@
|
||||
#pagination
|
||||
overflow: hidden
|
||||
margin-top: 1rem
|
||||
width: 100%
|
||||
|
||||
.pagination
|
||||
text-align: center
|
||||
.space
|
||||
color: $a-link-color
|
||||
|
||||
.page-number
|
||||
display: inline-block
|
||||
margin: 0 0.2rem
|
||||
min-width: w = 1.2rem
|
||||
height: w
|
||||
text-align: center
|
||||
line-height: w
|
||||
cursor: pointer
|
||||
|
||||
&.current
|
||||
background: $cyan
|
||||
color: $white
|
||||
cursor: default
|
||||
|
||||
img.prev_cover, img.next_cover
|
||||
position: absolute
|
||||
padding: 0
|
||||
z-index: 50
|
||||
top: 0
|
||||
left: 0
|
||||
width: 100%
|
||||
height: 100%
|
||||
opacity: .4
|
||||
background-size: cover
|
||||
transition: all 0.6s;
|
||||
object-fit: cover
|
||||
pointer-events: none
|
||||
|
||||
.prev_info
|
||||
position: absolute
|
||||
z-index: 100
|
||||
font-weight: 400
|
||||
width: 70%
|
||||
color: #fff
|
||||
overflow: hidden
|
||||
white-space: nowrap
|
||||
-o-text-overflow: ellipsis
|
||||
text-overflow: ellipsis
|
||||
display: block
|
||||
bottom: 50px
|
||||
|
||||
.next_info
|
||||
position: absolute
|
||||
z-index: 100
|
||||
font-weight: 400
|
||||
width: 70%
|
||||
color: #fff
|
||||
overflow: hidden
|
||||
white-space: nowrap
|
||||
-o-text-overflow: ellipsis
|
||||
text-overflow: ellipsis
|
||||
display: block
|
||||
right: 40px
|
||||
bottom: 50px
|
||||
text-align: right
|
||||
|
||||
.pull-full
|
||||
width: 100% !important
|
||||
|
||||
.prev-post .label
|
||||
position: absolute
|
||||
top: 50px
|
||||
z-index: 100
|
||||
font-size: 13px
|
||||
display: block
|
||||
text-transform: uppercase
|
||||
color: rgba(255,255,255,.7)
|
||||
|
||||
.next-post .label
|
||||
position: absolute
|
||||
top: 50px
|
||||
right: 40px
|
||||
z-index: 100
|
||||
display: block
|
||||
text-transform: uppercase
|
||||
color: rgba(255,255,255,.7)
|
||||
|
||||
.prev-post, .next-post
|
||||
width: 50%
|
||||
float: left
|
||||
|
||||
a
|
||||
width: 100%
|
||||
height: 150px
|
||||
padding: 55px 40px
|
||||
text-align: left
|
||||
position: relative
|
||||
display: block
|
||||
float: left
|
||||
overflow: hidden
|
||||
|
||||
&:hover
|
||||
img.prev_cover, img.next_cover
|
||||
opacity: .8
|
||||
transform:scale(1.1)
|
||||
|
||||
|
||||
@media screen and (max-width:768px)
|
||||
.prev-post, .next-post
|
||||
width: 100% !important
|
||||
|
||||
.pagination_post
|
||||
margin: 2rem 0 !important
|
||||
background: #000
|
||||
334
source/css/_layout/post.styl
Normal file
334
source/css/_layout/post.styl
Normal file
@@ -0,0 +1,334 @@
|
||||
#post-title
|
||||
font-size: 1.4rem
|
||||
|
||||
&.plain
|
||||
margin-bottom: 0.3rem
|
||||
border-bottom: 1px solid $light-grey
|
||||
cursor: pointer
|
||||
transition: all 0.2s ease-in-out
|
||||
|
||||
&:hover
|
||||
border-bottom: 1px solid $light-blue
|
||||
color: $light-blue
|
||||
|
||||
#post
|
||||
overflow: hidden
|
||||
|
||||
&-meta
|
||||
text-shadow: 0.1rem 0.1rem 0.2rem rgba(0, 0, 0, 0.15)
|
||||
|
||||
#post-meta
|
||||
color: $grey
|
||||
|
||||
a
|
||||
text-decoration: none
|
||||
|
||||
i.fa.fa-comment-o
|
||||
margin-right: 0.2rem
|
||||
|
||||
#top-container
|
||||
position: relative
|
||||
margin-bottom: 1rem
|
||||
background-color: $light-blue
|
||||
background-attachment: local
|
||||
background-position: center
|
||||
background-size: cover
|
||||
height: 19rem
|
||||
|
||||
&:before
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
display: block;
|
||||
content: '';
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
opacity: 0.5;
|
||||
background-color: #394245;
|
||||
background-image: linear-gradient(234deg, #394245 0%, #000 100%);
|
||||
|
||||
&.no-bg
|
||||
$bg-svg += ""
|
||||
background-color: $light-blue
|
||||
background-image: url($bg-svg) !important
|
||||
background-size: auto
|
||||
|
||||
&.plain
|
||||
margin-bottom: 1rem
|
||||
height: 56px
|
||||
|
||||
a
|
||||
color: $light-grey
|
||||
text-decoration: none
|
||||
transition: all 0.3s ease-out
|
||||
|
||||
&:hover
|
||||
color: $white
|
||||
|
||||
#top-img
|
||||
padding: 0
|
||||
border: none
|
||||
|
||||
#site-name
|
||||
font-weight: bold
|
||||
cursor: pointer
|
||||
|
||||
#post-info
|
||||
width: 100%
|
||||
color: $light-grey
|
||||
text-align: left
|
||||
padding-left: 8%
|
||||
position: absolute
|
||||
bottom: 1.5rem
|
||||
|
||||
#post-title
|
||||
text-shadow: 0.1rem 0.1rem 0.2rem rgba(0, 0, 0, 0.15)
|
||||
font-size: 1.5rem
|
||||
|
||||
i.fa.fa-angle-right
|
||||
margin: 0 0.3rem 0 0.2rem
|
||||
|
||||
.post-meta
|
||||
&__separator
|
||||
margin: 0 0.3rem
|
||||
|
||||
&__icon
|
||||
margin-right: 0.2rem
|
||||
|
||||
&__tags
|
||||
display: inline-block
|
||||
width: fit-content
|
||||
margin: 0.4rem 0.4rem 0.4rem 0
|
||||
padding: 0rem 0.6rem
|
||||
border: 1px solid $light-blue
|
||||
border-radius: 0.6rem
|
||||
background: $white
|
||||
color: $light-blue
|
||||
text-decoration: none
|
||||
font-size: 12px
|
||||
cursor: pointer
|
||||
transition: all 0.2s ease-in-out
|
||||
|
||||
&:hover
|
||||
background: $light-blue
|
||||
color: $white
|
||||
|
||||
.layout
|
||||
margin: 0 auto
|
||||
max-width: 1000px
|
||||
|
||||
#post-content
|
||||
margin-bottom: 1rem
|
||||
|
||||
ol,
|
||||
ul
|
||||
margin-top: 0.4rem
|
||||
counter-reset: li
|
||||
|
||||
p
|
||||
margin: 0
|
||||
|
||||
ol,
|
||||
ul
|
||||
padding-left: 0.5rem
|
||||
|
||||
li
|
||||
position: relative
|
||||
margin: 0.3rem 0
|
||||
padding-left: 0.3rem
|
||||
|
||||
a
|
||||
color: $a-link-color
|
||||
transition: all 0.2s
|
||||
|
||||
&:hover
|
||||
color: $light-blue
|
||||
text-decoration: none
|
||||
|
||||
&#site-name
|
||||
text-decoration: none
|
||||
|
||||
a.fancybox
|
||||
outline: none
|
||||
|
||||
&:focus
|
||||
outline: none
|
||||
|
||||
display: inline-block
|
||||
width: 100%
|
||||
text-align: center
|
||||
text-decoration: none
|
||||
|
||||
img
|
||||
padding: $img-border-padding
|
||||
max-width: 100%
|
||||
transition: all 0.2s
|
||||
|
||||
&:hover
|
||||
box-shadow: 0 0 8px 0 rgba(232, 237, 250, 0.6), 0 2px 4px 0 rgba(232, 237, 250, 0.5)
|
||||
|
||||
.code-area-wrap
|
||||
position: relative
|
||||
|
||||
.fa-clipboard
|
||||
position: absolute
|
||||
top: 0.4rem
|
||||
right: 10px
|
||||
z-index: 1
|
||||
color: $highlight-aqua
|
||||
cursor: pointer
|
||||
transition: color 0.2s
|
||||
|
||||
&:hover
|
||||
color: darken($highlight-aqua, 20%)
|
||||
|
||||
.copy-notice
|
||||
position: absolute
|
||||
top: 0
|
||||
right: 0
|
||||
z-index: 1
|
||||
background: darken($highlight-background, 5)
|
||||
color: $highlight-aqua
|
||||
opacity: 0
|
||||
|
||||
.post-copyright
|
||||
position: relative
|
||||
margin-bottom: 0.4rem
|
||||
padding: 0.5rem 0.8rem
|
||||
border: 1px solid $light-grey
|
||||
transition: box-shadow 0.3s ease-in-out
|
||||
|
||||
&:before
|
||||
position: absolute
|
||||
top: t = 0.5rem
|
||||
right: t
|
||||
width: w = 0.8rem
|
||||
height: w
|
||||
border-radius: w
|
||||
background: $light-blue
|
||||
content: ""
|
||||
|
||||
&:after
|
||||
position: absolute
|
||||
top: t = 0.7rem
|
||||
right: t
|
||||
width: w = 0.4rem
|
||||
height: w
|
||||
border-radius: w
|
||||
background: $white
|
||||
content: ""
|
||||
|
||||
&:hover
|
||||
box-shadow: 0 0 8px 0 rgba(232, 237, 250, 0.6), 0 2px 4px 0 rgba(232, 237, 250, 0.5)
|
||||
|
||||
&-meta
|
||||
color: $light-blue
|
||||
font-weight: bold
|
||||
|
||||
&-info
|
||||
a
|
||||
word-break: break-word
|
||||
|
||||
.post-adv
|
||||
margin: 1rem 0
|
||||
|
||||
@media screen and (max-width: $sm)
|
||||
.layout
|
||||
margin: 0 30px
|
||||
width: auto
|
||||
|
||||
#top-container
|
||||
// background-attachment: local
|
||||
|
||||
#post-title
|
||||
font-size: 1rem
|
||||
|
||||
#post-title
|
||||
font-size: 1.1rem
|
||||
|
||||
|
||||
@media screen and (min-width: $md)
|
||||
.layout
|
||||
width: $content-large-width
|
||||
|
||||
|
||||
|
||||
.katex-wrap
|
||||
overflow: auto
|
||||
if hexo-config("katex") && hexo-config("katex.hide_scrollbar")
|
||||
&::-webkit-scrollbar
|
||||
display: none
|
||||
|
||||
|
||||
// 文章字體
|
||||
#post-content p {
|
||||
font-size: 1.1em
|
||||
}
|
||||
|
||||
#post-content ol, #post-content ul {
|
||||
font-size: 1em
|
||||
}
|
||||
|
||||
|
||||
|
||||
@media screen and (max-width: 900px)
|
||||
.layout
|
||||
margin: 0 15px
|
||||
width: auto
|
||||
|
||||
|
||||
|
||||
|
||||
.layout_post
|
||||
padding: 50px
|
||||
-webkit-box-shadow: 0 4px 8px 6px rgba(7,17,27,0.06)
|
||||
box-shadow: 0 4px 8px 6px rgba(7,17,27,0.06)
|
||||
border-radius: 8px
|
||||
-webkit-transition: all 0.3s
|
||||
-moz-transition: all 0.3s
|
||||
-o-transition: all 0.3s
|
||||
-ms-transition: all 0.3s
|
||||
transition: all 0.3s
|
||||
background: #fff
|
||||
margin-top: 40px
|
||||
margin-bottom: 40px
|
||||
|
||||
&:hover
|
||||
-webkit-box-shadow: 0 4px 12px 12px rgba(7,17,27,0.15)
|
||||
box-shadow: 0 4px 12px 12px rgba(7,17,27,0.15)
|
||||
|
||||
img
|
||||
margin:0 auto
|
||||
display:block
|
||||
|
||||
|
||||
|
||||
.tag_share
|
||||
display: block
|
||||
|
||||
.post-meta__tag-list
|
||||
display: inline-block
|
||||
|
||||
.post_share
|
||||
width: fit-content;
|
||||
display: inline-block;
|
||||
float: right;
|
||||
margin: 0.4rem 0
|
||||
|
||||
.social-share
|
||||
font-size: 12px
|
||||
|
||||
.social-share .social-share-icon
|
||||
width: 26px;
|
||||
height: 26px;
|
||||
font-size: 15px;
|
||||
line-height: 25px;
|
||||
|
||||
.social-share a
|
||||
margin: 0 4px;
|
||||
|
||||
|
||||
#post
|
||||
a
|
||||
text-decoration: none
|
||||
color: $light-blue
|
||||
80
source/css/_layout/relatedposts.styl
Normal file
80
source/css/_layout/relatedposts.styl
Normal file
@@ -0,0 +1,80 @@
|
||||
.relatedPosts
|
||||
margin: 0 auto
|
||||
padding: 0
|
||||
margin-top: 1rem
|
||||
width: 100%
|
||||
|
||||
.relatedPosts_item
|
||||
width: calc(100%/3 - 10px)
|
||||
height: 200px
|
||||
overflow: hidden
|
||||
float: left
|
||||
position: relative
|
||||
margin: 5px
|
||||
background: #000
|
||||
|
||||
&:hover
|
||||
.relatedPosts_cover
|
||||
opacity: .8
|
||||
transform:scale(1.1)
|
||||
|
||||
|
||||
.relatedPosts_cover
|
||||
border: 0
|
||||
-webkit-transition: all 0.6s
|
||||
-moz-transition: all 0.6s
|
||||
-o-transition: all 0.6s
|
||||
-ms-transition: all 0.6s
|
||||
transition: all 0.6s
|
||||
display: block
|
||||
width: 100%
|
||||
height: 100%
|
||||
padding: 0
|
||||
opacity: 0.4
|
||||
margin: 0
|
||||
object-fit: cover
|
||||
|
||||
.relatedPosts_title
|
||||
color: #fff
|
||||
position: absolute
|
||||
left: 0
|
||||
right: 0
|
||||
top: 45%
|
||||
height: 60px
|
||||
padding: 0 30px
|
||||
display: -webkit-box
|
||||
-webkit-line-clamp: 2
|
||||
-webkit-box-orient: vertical
|
||||
overflow: hidden
|
||||
max-width: 100%
|
||||
width: 100%
|
||||
margin: 0 auto
|
||||
text-align: center
|
||||
|
||||
.relatedPosts_headling
|
||||
font-size: 20px
|
||||
font-weight: 700
|
||||
margin-bottom: 5px
|
||||
|
||||
.clear_both
|
||||
clear: both
|
||||
|
||||
|
||||
|
||||
@media screen and (max-width:768px)
|
||||
.relatedPosts_item
|
||||
width: calc(100%/2 - 4px)
|
||||
height: 150px
|
||||
margin: 2px
|
||||
|
||||
.relatedPosts_title
|
||||
top: 40%
|
||||
|
||||
@media screen and (max-width:480px)
|
||||
.relatedPosts_item
|
||||
width: calc(100% - 4px)
|
||||
height: 150px
|
||||
margin: 2px
|
||||
|
||||
.relatedPosts_title
|
||||
top: 40%
|
||||
71
source/css/_layout/reward.styl
Normal file
71
source/css/_layout/reward.styl
Normal file
@@ -0,0 +1,71 @@
|
||||
.post-reward
|
||||
position: relative
|
||||
width: 100%
|
||||
margin: 75px auto 0
|
||||
text-align: center
|
||||
display: block
|
||||
|
||||
.reward-buttom
|
||||
text-align: center
|
||||
display: inline-block
|
||||
cursor: pointer
|
||||
color: #fff
|
||||
line-height: 36px
|
||||
background: #49b1f5
|
||||
width: 80px
|
||||
|
||||
&:hover
|
||||
background: #00c4b6
|
||||
|
||||
.reward-main
|
||||
display: block
|
||||
|
||||
|
||||
.reward-main
|
||||
position: absolute
|
||||
bottom: 40px
|
||||
margin: 0
|
||||
padding: 0 0 15px
|
||||
width: 100%
|
||||
left: 0
|
||||
transition: all 0.6s
|
||||
display: none
|
||||
|
||||
.reward-all
|
||||
margin: 0 auto
|
||||
padding: 20px 10px 8px
|
||||
background: #f5f5f5
|
||||
display: inline-block
|
||||
border-radius: 4px
|
||||
cursor: auto
|
||||
|
||||
&:after
|
||||
content: ""
|
||||
width: 0
|
||||
height: 0
|
||||
border-left: 13px solid transparent
|
||||
border-right: 13px solid transparent
|
||||
border-top: 13px solid #f5f5f5
|
||||
position: absolute
|
||||
bottom: 2px
|
||||
left: 0
|
||||
right: 0
|
||||
margin: 0 auto
|
||||
|
||||
.reward-item
|
||||
list-style-type: none
|
||||
padding: 0 8px
|
||||
display: inline-block
|
||||
|
||||
img
|
||||
width: 130px
|
||||
max-width: 130px
|
||||
border-radius: 3px
|
||||
position: relative
|
||||
|
||||
.post-qr-code__desc
|
||||
text-align: center
|
||||
margin: -10px 0
|
||||
color: #858585
|
||||
|
||||
|
||||
60
source/css/_layout/sidebar.styl
Normal file
60
source/css/_layout/sidebar.styl
Normal file
@@ -0,0 +1,60 @@
|
||||
#sidebar
|
||||
position: fixed
|
||||
top: 0
|
||||
left: -300px
|
||||
z-index: 10
|
||||
overflow-y: auto
|
||||
padding: 1rem 0 2rem 0.5rem
|
||||
width: $sidebar-width
|
||||
height: 100%
|
||||
background: $sidebar-background
|
||||
box-shadow: -0.25rem 0 0.25rem rgba(232, 237, 250, 0.6) inset
|
||||
opacity: 0.9
|
||||
transition: all 0.2s
|
||||
|
||||
.sidebar-toc
|
||||
ol,
|
||||
li
|
||||
list-style: none
|
||||
|
||||
ol
|
||||
margin-top: 0.2rem
|
||||
padding-left: 0.4rem
|
||||
|
||||
&__title
|
||||
padding-right: 0.5rem
|
||||
text-align: center
|
||||
font-size: unit(0.9 * $rem, "px")
|
||||
|
||||
.toc-link
|
||||
display: block
|
||||
padding-left: 0.2rem
|
||||
border-right: 3px solid transparent
|
||||
text-decoration: none
|
||||
transition: all 0.2s ease-in-out
|
||||
|
||||
&.active
|
||||
border-right-color: darken($cyan, 20%)
|
||||
background: $cyan
|
||||
color: $white
|
||||
|
||||
&__progress
|
||||
position: relative
|
||||
margin-top: -0.3rem
|
||||
padding-left: 0.6rem
|
||||
color: $cyan
|
||||
|
||||
.progress-notice
|
||||
margin-right: 0.4rem
|
||||
|
||||
.progress-num
|
||||
display: inline-block
|
||||
min-width: 0.9rem
|
||||
|
||||
&-bar
|
||||
width: 0
|
||||
height: 1px
|
||||
background: $cyan
|
||||
|
||||
|
||||
|
||||
72
source/css/_search/algolia.styl
Normal file
72
source/css/_search/algolia.styl
Normal file
@@ -0,0 +1,72 @@
|
||||
#algolia-search
|
||||
.ais-search-box
|
||||
margin: 0 auto
|
||||
max-width: 100%
|
||||
width: 100%
|
||||
|
||||
input
|
||||
padding: 0.25rem 0.7rem
|
||||
outline: none
|
||||
border: 2px solid $light-blue
|
||||
border-radius: 2rem
|
||||
font-size: 14px
|
||||
|
||||
.ais-hits--item.algolia-hit-item
|
||||
position: relative
|
||||
padding-left: 1.5rem
|
||||
|
||||
&:hover
|
||||
&:before
|
||||
border-color: $ruby
|
||||
|
||||
&:before
|
||||
$w = 0.3rem
|
||||
position: absolute
|
||||
top: 0.4rem
|
||||
left: 0
|
||||
width: w = $w
|
||||
height: h = w
|
||||
border: 0.5 * w solid $light-blue
|
||||
border-radius: w
|
||||
background: $white
|
||||
content: ""
|
||||
line-height: h
|
||||
transition: all 0.2s ease-in-out
|
||||
|
||||
a
|
||||
display: block
|
||||
color: $font-black
|
||||
text-decoration: none
|
||||
font-size: 14px
|
||||
cursor: pointer
|
||||
|
||||
&:hover
|
||||
color: $light-blue
|
||||
|
||||
.ais-pagination.pagination
|
||||
margin: 0.8rem 0 0 0
|
||||
padding: 0
|
||||
text-align: center
|
||||
|
||||
.ais-pagination--item
|
||||
margin: 0 0.2rem
|
||||
padding: 0
|
||||
|
||||
a
|
||||
display: inline-block
|
||||
min-width: 1.2rem
|
||||
height: 1.2rem
|
||||
text-align: center
|
||||
line-height: 1.2rem
|
||||
|
||||
.ais-pagination--item.current
|
||||
a
|
||||
background: $cyan
|
||||
color: $white
|
||||
text-decoration: none
|
||||
cursor: default
|
||||
|
||||
.algolia-logo
|
||||
padding-top: 2px
|
||||
width: 4rem
|
||||
height: 1.5rem
|
||||
46
source/css/_search/index.styl
Normal file
46
source/css/_search/index.styl
Normal file
@@ -0,0 +1,46 @@
|
||||
.search-dialog
|
||||
position: fixed
|
||||
top: 5rem
|
||||
left: 50%
|
||||
z-index: 1001
|
||||
display: none
|
||||
margin-left: -15rem
|
||||
padding: 1rem
|
||||
width: 30rem
|
||||
background: $white
|
||||
|
||||
hr
|
||||
margin: 1rem auto
|
||||
|
||||
span.search-close-button
|
||||
position: absolute
|
||||
top: 0.5rem
|
||||
right: 0.5rem
|
||||
color: $grey
|
||||
line-height: 1
|
||||
cursor: pointer
|
||||
transition: color 0.2s ease-in-out
|
||||
|
||||
&:hover
|
||||
color: $light-blue
|
||||
|
||||
&__title
|
||||
padding: 0 0 0.7rem
|
||||
color: $light-blue
|
||||
font-size: 1rem
|
||||
line-height: 1
|
||||
|
||||
.search-mask
|
||||
position: fixed
|
||||
top: 0
|
||||
right: 0
|
||||
bottom: 0
|
||||
left: 0
|
||||
z-index: 1000
|
||||
display: none
|
||||
background: rgba(0, 0, 0, 0.6)
|
||||
|
||||
@media screen and (max-width: $sm)
|
||||
.search-dialog
|
||||
margin-left: -45%
|
||||
width: 90%
|
||||
52
source/css/_search/local-search.styl
Normal file
52
source/css/_search/local-search.styl
Normal file
@@ -0,0 +1,52 @@
|
||||
#local-search
|
||||
.local-search-box
|
||||
margin: 0 auto
|
||||
max-width: 100%
|
||||
width: 100%
|
||||
|
||||
input
|
||||
padding: 0.25rem 0.7rem
|
||||
width: 100%
|
||||
outline: none
|
||||
border: 2px solid $light-blue
|
||||
border-radius: 2rem
|
||||
font-size: 14px
|
||||
|
||||
.local-search__hit-item
|
||||
position: relative
|
||||
padding-left: 1.5rem
|
||||
|
||||
&:hover
|
||||
&:before
|
||||
border-color: $ruby
|
||||
|
||||
&:before
|
||||
$w = 0.3rem
|
||||
position: absolute
|
||||
top: 0.4rem
|
||||
left: 0
|
||||
width: w = $w
|
||||
height: h = w
|
||||
border: 0.5 * w solid $light-blue
|
||||
border-radius: w
|
||||
background: $white
|
||||
content: ""
|
||||
line-height: h
|
||||
transition: all 0.2s ease-in-out
|
||||
|
||||
a
|
||||
display: block
|
||||
color: $font-black
|
||||
text-decoration: none
|
||||
font-size: 14px
|
||||
cursor: pointer
|
||||
|
||||
&:hover
|
||||
color: $light-blue
|
||||
|
||||
.local-search-stats__hr
|
||||
display: none !important
|
||||
|
||||
.search-result-list
|
||||
overflow-y: auto
|
||||
max-height: 10.5rem
|
||||
1
source/css/_third-party/jquery.fancybox.min.css
vendored
Normal file
1
source/css/_third-party/jquery.fancybox.min.css
vendored
Normal file
File diff suppressed because one or more lines are too long
1
source/css/_third-party/normalize.min.css
vendored
Normal file
1
source/css/_third-party/normalize.min.css
vendored
Normal file
@@ -0,0 +1 @@
|
||||
/*! normalize.css v7.0.0 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,footer,header,nav,section{display:block}h1{font-size:2em;margin:.67em 0}figcaption,figure,main{display:block}figure{margin:1em 40px}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent;-webkit-text-decoration-skip:objects}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:inherit}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}dfn{font-style:italic}mark{background-color:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}audio,video{display:inline-block}audio:not([controls]){display:none;height:0}img{border-style:none}svg:not(:root){overflow:hidden}button,input,optgroup,select,textarea{font-family:sans-serif;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=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{display:inline-block;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-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details,menu{display:block}summary{display:list-item}canvas{display:inline-block}template{display:none}[hidden]{display:none}/*# sourceMappingURL=normalize.min.css.map */
|
||||
21
source/css/index.styl
Normal file
21
source/css/index.styl
Normal file
@@ -0,0 +1,21 @@
|
||||
@import "nib"
|
||||
@import "_third-party/normalize.min.css"
|
||||
// project
|
||||
@import "var"
|
||||
@import "_global"
|
||||
@import "_highlight/highlight"
|
||||
@import "_layout/*"
|
||||
@import "other"
|
||||
if hexo-config("nightshift.enable")
|
||||
@import "nightshift"
|
||||
|
||||
// search
|
||||
if hexo-config("algolia_search.enable")
|
||||
@import "_search/index"
|
||||
@import "_search/algolia"
|
||||
|
||||
if hexo-config("local_search") && hexo-config("local_search.enable")
|
||||
@import "_search/index"
|
||||
@import "_search/local-search"
|
||||
|
||||
|
||||
229
source/css/nightshift.styl
Normal file
229
source/css/nightshift.styl
Normal file
@@ -0,0 +1,229 @@
|
||||
.night-mode
|
||||
footer
|
||||
background: #2d3035
|
||||
|
||||
#sidebar
|
||||
background: #2d3035 !important
|
||||
box-shadow: -0.25rem 0 0.25rem #2d3035 !important
|
||||
|
||||
if hexo-config("local_search") && hexo-config("local_search.enable")
|
||||
#local-search
|
||||
background: #2d3035
|
||||
.local-search-box--input
|
||||
background: #2d3035
|
||||
color: #99a9bf
|
||||
|
||||
.search-result-title
|
||||
color: #99a9bf
|
||||
if hexo-config("algolia_search.enable")
|
||||
#algolia-search
|
||||
background: #2d3035
|
||||
.ais-search-box--input
|
||||
background: #2d3035
|
||||
color: #99a9bf
|
||||
|
||||
#algolia-search-results
|
||||
.algolia-hit-item-link
|
||||
color: #99a9bf !important
|
||||
|
||||
h1, h2, h3, h4, h5, h6
|
||||
color: #99a9bf
|
||||
|
||||
.article-container code
|
||||
background: #616a6b
|
||||
color: #99a9bf
|
||||
|
||||
// 評論
|
||||
#vcomment
|
||||
*
|
||||
color: #99a9bf !important
|
||||
|
||||
.vsys
|
||||
background: rgb(97, 106, 107) !important
|
||||
|
||||
.vbtn
|
||||
background: rgb(45, 48, 53) !important
|
||||
color: #99a9bf !important
|
||||
|
||||
.recent-post-item .article-title
|
||||
color: #99a9bf
|
||||
|
||||
#page-header
|
||||
&.fixed
|
||||
background: #2d3035
|
||||
box-shadow: 0 5px 6px -5px rgba(133,133,133,0)
|
||||
|
||||
a,
|
||||
.toggle-menu,
|
||||
#site-name
|
||||
color: #99a9bf
|
||||
|
||||
blockquote
|
||||
border-left: 0.2rem solid #7A5353
|
||||
color: #99a9bf
|
||||
|
||||
hr
|
||||
background: 0
|
||||
border: 2px dashed #616A6B
|
||||
&:before
|
||||
color: #99a9bf
|
||||
|
||||
.post-meta__tags
|
||||
background: 0
|
||||
border: 1px solid #99a9bf
|
||||
color: #99a9bf
|
||||
|
||||
|
||||
.post-copyright
|
||||
border: 1px solid #99a9bf
|
||||
|
||||
*
|
||||
color: #99a9bf
|
||||
|
||||
.article-container .highlight
|
||||
background-color: #1B2631
|
||||
.code pre
|
||||
background-color: #1B2631
|
||||
|
||||
.gutter pre
|
||||
background: #1C2833
|
||||
|
||||
|
||||
&:after
|
||||
background: rgb(27, 38, 59)
|
||||
|
||||
table
|
||||
&:after,.copy-notice
|
||||
background: rgb(27, 38, 59)
|
||||
|
||||
.copy-notice
|
||||
background: rgb(27, 38, 59)
|
||||
|
||||
.post-cards,.md-links-item
|
||||
// background: #2d3035
|
||||
a
|
||||
color: #99a9bf
|
||||
|
||||
.aplayer
|
||||
color: #000000
|
||||
filter: brightness(0.6)
|
||||
|
||||
.article-sort-item__title
|
||||
color: #99a9bf
|
||||
|
||||
.category-list
|
||||
a
|
||||
color: #99a9bf
|
||||
|
||||
|
||||
|
||||
.translate_chn_to_cht,
|
||||
.nightshift,
|
||||
#to_comment
|
||||
background-color: #2d3035 !important
|
||||
|
||||
img
|
||||
filter: brightness(0.6)
|
||||
|
||||
.layout_post
|
||||
background:#2d3035
|
||||
|
||||
canvas
|
||||
display: none !important
|
||||
|
||||
#aside_content
|
||||
.card_widget
|
||||
background:#2d3035 !important
|
||||
.headline,
|
||||
.length_num,
|
||||
.aside_post_title,
|
||||
.aside_category_list_link,
|
||||
.archive-list-link,
|
||||
.social-icon
|
||||
color: #99a9bf !important
|
||||
|
||||
#bookmark-it
|
||||
background: #616a6b !important
|
||||
|
||||
#archive,
|
||||
.tag-cloud,
|
||||
#tag,
|
||||
.category-content,
|
||||
#category,
|
||||
#page,
|
||||
.flink
|
||||
background:#2d3035
|
||||
|
||||
#nav,
|
||||
#top-container
|
||||
&::before
|
||||
content: ""
|
||||
position: absolute
|
||||
top: 0
|
||||
bottom: 0
|
||||
left: 0
|
||||
right: 0
|
||||
background-color: rgba(0,0,0,.6)
|
||||
|
||||
.layout_page
|
||||
.post-meta__date,
|
||||
.article-meta__separator,
|
||||
.article-meta__categories,
|
||||
i
|
||||
color: #99a9bf
|
||||
|
||||
#site-info .blogtitle,
|
||||
span.subtitle,
|
||||
#post-info .posttitle,
|
||||
#post-info #post-meta,
|
||||
#site-social-icons i,
|
||||
#top-container a
|
||||
color: rgba(238,238,238,.6)
|
||||
|
||||
//打賞 分享
|
||||
.post-reward
|
||||
.reward-buttom
|
||||
background-color: #616a6b
|
||||
.post_share
|
||||
filter: brightness(0.6)
|
||||
img
|
||||
filter: brightness(1)
|
||||
|
||||
|
||||
|
||||
|
||||
@media screen and (max-width: 768px)
|
||||
.night-mode
|
||||
color: #99a9bf
|
||||
background-color: rgb(45, 48, 53)
|
||||
|
||||
#page-header
|
||||
.menus
|
||||
a
|
||||
color: #99a9bf
|
||||
background: #2d3035
|
||||
&.fixed
|
||||
.menu-icon-first,
|
||||
.menu-icon-second,
|
||||
.menu-icon-third
|
||||
background-color: #99a9bf;
|
||||
|
||||
|
||||
@media screen and (min-width: 768px)
|
||||
.night-mode
|
||||
color: #99a9bf
|
||||
background-color: #2d3032
|
||||
|
||||
.recent-post-item
|
||||
background: #2d3035 !important
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
355
source/css/other.styl
Normal file
355
source/css/other.styl
Normal file
@@ -0,0 +1,355 @@
|
||||
#recent-posts
|
||||
.recent-post-item
|
||||
padding: 0
|
||||
box-shadow: 0 4px 8px 6px rgba(7,17,27,0.06)
|
||||
border-radius: 8px
|
||||
-webkit-transition: all 0.3s
|
||||
-moz-transition: all 0.3s
|
||||
-o-transition: all 0.3s
|
||||
-ms-transition: all 0.3s
|
||||
transition: all 0.3s
|
||||
background: #fff
|
||||
margin-top: 20px
|
||||
height: 280px
|
||||
|
||||
&:hover
|
||||
-webkit-box-shadow: 0 4px 12px 12px rgba(7,17,27,0.15)
|
||||
box-shadow: 0 4px 12px 12px rgba(7,17,27,0.15)
|
||||
|
||||
img.post_bg
|
||||
transform:scale(1.1)
|
||||
|
||||
.is_left
|
||||
float: left
|
||||
border-top-left-radius: 8px
|
||||
border-bottom-left-radius: 8px
|
||||
|
||||
.is_right
|
||||
float: right
|
||||
border-top-right-radius: 8px
|
||||
border-bottom-right-radius: 8px
|
||||
|
||||
.post_cover
|
||||
width: 45%
|
||||
height: 280px
|
||||
overflow: hidden
|
||||
|
||||
|
||||
|
||||
|
||||
img.post_bg
|
||||
border: 0
|
||||
transition: all .6s
|
||||
display: block
|
||||
width: 100%
|
||||
height: 100%
|
||||
padding: 0
|
||||
margin: 0
|
||||
object-fit: cover
|
||||
|
||||
|
||||
&:hover
|
||||
transform:scale(1.1)
|
||||
|
||||
#pagination
|
||||
margin-top: 2rem
|
||||
|
||||
|
||||
.recent-post-info
|
||||
padding: 50px 40px
|
||||
display: inline-block
|
||||
width: 55%
|
||||
overflow hidden
|
||||
|
||||
|
||||
a.article-meta__categories
|
||||
text-decoration: none
|
||||
color: #858585
|
||||
|
||||
&:hover
|
||||
color: #49b1f5 !important
|
||||
|
||||
.content
|
||||
display: -webkit-box
|
||||
-webkit-line-clamp: 3
|
||||
-webkit-box-orient: vertical
|
||||
overflow: hidden
|
||||
height: 90px
|
||||
|
||||
.more {
|
||||
position: relative
|
||||
letter-spacing: 1.2px
|
||||
text-transform: uppercase
|
||||
overflow: hidden
|
||||
z-index: 1
|
||||
|
||||
&:focus {
|
||||
outline: none
|
||||
}
|
||||
}
|
||||
|
||||
.more--primary {
|
||||
color: lightslategray
|
||||
}
|
||||
|
||||
.more--animated {
|
||||
transition-property: color
|
||||
transition-duration: 0.5s
|
||||
|
||||
&.more--border.more--primary {
|
||||
border: 1px solid lightslategray
|
||||
}
|
||||
|
||||
&:before {
|
||||
content: ""
|
||||
position: absolute
|
||||
top: 0
|
||||
left: 0
|
||||
right: 0
|
||||
bottom: 0
|
||||
background: lightslategray
|
||||
transform: scaleX(0)
|
||||
transform-origin: 0 50%
|
||||
transition-property: transform
|
||||
transition-duration: 0.5s
|
||||
transition-timing-function: ease-out
|
||||
z-index: -1
|
||||
}
|
||||
|
||||
&:hover {
|
||||
color: white
|
||||
|
||||
&:before {
|
||||
transform: scaleX(1)
|
||||
transition-timing-function: cubic-bezier(0.45, 1.64, 0.47, 0.66)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.layout_page
|
||||
display: flex
|
||||
margin: 0 auto
|
||||
max-width: 1200px
|
||||
align-items: flex-start
|
||||
padding: 0 15px
|
||||
|
||||
#recent-posts
|
||||
width: 75%
|
||||
|
||||
#page,.category-content,.flink
|
||||
padding: 40px 44px 44px
|
||||
|
||||
#page,.category-content,#archive,.tag-cloud,.flink,#tag,#category
|
||||
box-shadow: 0 4px 8px 6px rgba(7,17,27,.06)
|
||||
border-radius: 8px
|
||||
transition: all .3s
|
||||
background: #fff
|
||||
margin-top: 20px
|
||||
width: 75%
|
||||
|
||||
.card_widget,#archive,.tag-cloud,#tag,.category-content,#category,#page,.flink
|
||||
|
||||
&:hover
|
||||
-webkit-box-shadow: 0 4px 12px 12px rgba(7,17,27,0.15)
|
||||
box-shadow: 0 4px 12px 12px rgba(7,17,27,0.15)
|
||||
|
||||
#page_site-info
|
||||
padding: 10rem 1rem 7rem
|
||||
#site-title
|
||||
font-family: PingFang SC, Hiragino Sans GB, "Microsoft JhengHei", "Microsoft YaHei", Helvetica Neue, Helvetica, Arial, sans-serif
|
||||
|
||||
@media screen and (max-width: 900px)
|
||||
#page,.category-content,#archive,.tag-cloud,.flink,#tag,#category
|
||||
width: 100% !important
|
||||
|
||||
// .recent-post-info
|
||||
// padding: 40px 30px 20px
|
||||
|
||||
|
||||
@media screen and (max-width:768px)
|
||||
.recent-post-item
|
||||
height: auto !important
|
||||
border-radius: 8px
|
||||
|
||||
.post_cover
|
||||
width: 100% !important
|
||||
height: 230px !important
|
||||
border-radius: 8px !important
|
||||
|
||||
.recent-post-item,#page,.tag-cloud,.flink
|
||||
margin-top: 1px
|
||||
|
||||
.recent-post-item,#page,.category-content,.tag-cloud,.flink
|
||||
box-shadow: none !important
|
||||
background: none !important
|
||||
padding: 0px 20px 0 !important
|
||||
|
||||
&:hover
|
||||
-webkit-box-shadow: none
|
||||
box-shadow: none
|
||||
|
||||
#archive,#category,#tag
|
||||
box-shadow: none !important
|
||||
background: none !important
|
||||
padding: 0px 30px 0 !important
|
||||
|
||||
|
||||
.layout_post
|
||||
padding: 0 20px 0
|
||||
border-radius: 0
|
||||
-webkit-box-shadow: none
|
||||
box-shadow: none
|
||||
background: none
|
||||
margin: 0
|
||||
|
||||
&:hover
|
||||
-webkit-box-shadow: none
|
||||
box-shadow: none
|
||||
|
||||
|
||||
.layout_page
|
||||
padding: 0 !important
|
||||
|
||||
#aside_content
|
||||
display: none !important
|
||||
// .card_widget
|
||||
// box-shadow: none
|
||||
// border-radius: 0
|
||||
// border-top: 1px dashed #a4d8fa
|
||||
|
||||
// &:hover
|
||||
// box-shadow: none
|
||||
|
||||
|
||||
.category-lists
|
||||
padding: 0
|
||||
|
||||
|
||||
|
||||
.recent-post-info
|
||||
padding: 20px 10px !important
|
||||
width: 100%
|
||||
|
||||
#recent-posts #pagination
|
||||
margin-bottom: 0
|
||||
|
||||
.more_setting
|
||||
display: block !important
|
||||
|
||||
#nav #site-social-icons
|
||||
display: block
|
||||
|
||||
#page_site-info
|
||||
padding: 7rem 1rem 5rem
|
||||
|
||||
#top-container
|
||||
height: 14rem
|
||||
|
||||
#post-info
|
||||
bottom: 1rem
|
||||
padding-left: 5%
|
||||
|
||||
.mobile_hidden
|
||||
display: none
|
||||
|
||||
|
||||
canvas
|
||||
display: none !important
|
||||
|
||||
|
||||
|
||||
.layout_page,
|
||||
.layout_post,
|
||||
footer
|
||||
animation: main 1s;
|
||||
|
||||
#nav,
|
||||
#top-container
|
||||
animation: header 1s
|
||||
|
||||
#site-title
|
||||
animation: titlescale 1s
|
||||
|
||||
.search-dialog
|
||||
transition: all .2s
|
||||
|
||||
.scroll-down-effects
|
||||
-webkit-animation: pulse 1.5s infinite
|
||||
animation: pulse 1.5s infinite
|
||||
// font-size: 28px
|
||||
position: absolute
|
||||
color: #fff
|
||||
|
||||
@keyframes pulse{
|
||||
|
||||
0%,to{
|
||||
// -ms-filter:"alpha(opacity=40)"
|
||||
// filter:alpha(opacity=40)
|
||||
opacity:.4
|
||||
top:0}
|
||||
50%{
|
||||
// -ms-filter:none
|
||||
// -webkit-filter:none
|
||||
// filter:none
|
||||
opacity:1
|
||||
top:-16px}
|
||||
}
|
||||
|
||||
@keyframes header {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: translateY(-50px)
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: translateY(0)
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
@keyframes main {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: translateY(50px)
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: translateY(0)
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes titlescale{
|
||||
|
||||
0% {
|
||||
// opacity:0;
|
||||
transform: scale(0.7)
|
||||
}
|
||||
100% {
|
||||
// opacity:1;
|
||||
transform: scale(1)
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
.article-container .code_full_page
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
min-width: 100%;
|
||||
z-index: 9999;
|
||||
margin: 0;
|
||||
animation: code_full_page 1s;
|
||||
|
||||
.code_body
|
||||
overflow: hidden
|
||||
|
||||
@keyframes code_full_page{
|
||||
0%{transform:scale(0)}
|
||||
50%{transform:scale(1)}
|
||||
80%{transform:scale(.98)}
|
||||
100%{transform:scale(1)}}
|
||||
|
||||
84
source/css/var.styl
Normal file
84
source/css/var.styl
Normal file
File diff suppressed because one or more lines are too long
BIN
source/img/404.jpg
Normal file
BIN
source/img/404.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 55 KiB |
9
source/img/algolia.svg
Normal file
9
source/img/algolia.svg
Normal file
@@ -0,0 +1,9 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1366 362">
|
||||
<linearGradient id="a" x1="428.258" x2="434.145" y1="404.15" y2="409.85" gradientUnits="userSpaceOnUse" gradientTransform="matrix(94.045 0 0 -94.072 -40381.527 38479.52)">
|
||||
<stop offset="0" stop-color="#00aeff"/>
|
||||
<stop offset="1" stop-color="#3369e7"/>
|
||||
</linearGradient>
|
||||
<path fill="url(#a)" d="M61.8 15.4h242.8c23.9 0 43.4 19.4 43.4 43.4v242.9c0 23.9-19.4 43.4-43.4 43.4H61.8c-23.9 0-43.4-19.4-43.4-43.4v-243c0-23.9 19.4-43.3 43.4-43.3z"/>
|
||||
<path fill="#FFF" d="M187 98.7c-51.4 0-93.1 41.7-93.1 93.2S135.6 285 187 285s93.1-41.7 93.1-93.2-41.6-93.1-93.1-93.1zm0 158.8c-36.2 0-65.6-29.4-65.6-65.6s29.4-65.6 65.6-65.6 65.6 29.4 65.6 65.6-29.3 65.6-65.6 65.6zm0-117.8v48.9c0 1.4 1.5 2.4 2.8 1.7l43.4-22.5c1-.5 1.3-1.7.8-2.7-9-15.8-25.7-26.6-45-27.3-1 0-2 .8-2 1.9zm-60.8-35.9l-5.7-5.7c-5.6-5.6-14.6-5.6-20.2 0l-6.8 6.8c-5.6 5.6-5.6 14.6 0 20.2l5.6 5.6c.9.9 2.2.7 3-.2 3.3-4.5 6.9-8.8 10.9-12.8 4.1-4.1 8.3-7.7 12.9-11 1-.6 1.1-2 .3-2.9zM217.5 89V77.7c0-7.9-6.4-14.3-14.3-14.3h-33.3c-7.9 0-14.3 6.4-14.3 14.3v11.6c0 1.3 1.2 2.2 2.5 1.9 9.3-2.7 19.1-4.1 29-4.1 9.5 0 18.9 1.3 28 3.8 1.2.3 2.4-.6 2.4-1.9z"/>
|
||||
<path fill="#182359" d="M842.5 267.6c0 26.7-6.8 46.2-20.5 58.6-13.7 12.4-34.6 18.6-62.8 18.6-10.3 0-31.7-2-48.8-5.8l6.3-31c14.3 3 33.2 3.8 43.1 3.8 15.7 0 26.9-3.2 33.6-9.6s10-15.9 10-28.5v-6.4c-3.9 1.9-9 3.8-15.3 5.8-6.3 1.9-13.6 2.9-21.8 2.9-10.8 0-20.6-1.7-29.5-5.1-8.9-3.4-16.6-8.4-22.9-15-6.3-6.6-11.3-14.9-14.8-24.8s-5.3-27.6-5.3-40.6c0-12.2 1.9-27.5 5.6-37.7 3.8-10.2 9.2-19 16.5-26.3 7.2-7.3 16-12.9 26.3-17s22.4-6.7 35.5-6.7c12.7 0 24.4 1.6 35.8 3.5 11.4 1.9 21.1 3.9 29 6.1v155.2zm-108.7-77.2c0 16.4 3.6 34.6 10.8 42.2 7.2 7.6 16.5 11.4 27.9 11.4 6.2 0 12.1-.9 17.6-2.6 5.5-1.7 9.9-3.7 13.4-6.1v-97.1c-2.8-.6-14.5-3-25.8-3.3-14.2-.4-25 5.4-32.6 14.7-7.5 9.3-11.3 25.6-11.3 40.8zm294.3 0c0 13.2-1.9 23.2-5.8 34.1s-9.4 20.2-16.5 27.9c-7.1 7.7-15.6 13.7-25.6 17.9s-25.4 6.6-33.1 6.6c-7.7-.1-23-2.3-32.9-6.6-9.9-4.3-18.4-10.2-25.5-17.9-7.1-7.7-12.6-17-16.6-27.9s-6-20.9-6-34.1c0-13.2 1.8-25.9 5.8-36.7 4-10.8 9.6-20 16.8-27.7s15.8-13.6 25.6-17.8c9.9-4.2 20.8-6.2 32.6-6.2s22.7 2.1 32.7 6.2c10 4.2 18.6 10.1 25.6 17.8 7.1 7.7 12.6 16.9 16.6 27.7 4.2 10.8 6.3 23.5 6.3 36.7zm-40 .1c0-16.9-3.7-31-10.9-40.8-7.2-9.9-17.3-14.8-30.2-14.8-12.9 0-23 4.9-30.2 14.8-7.2 9.9-10.7 23.9-10.7 40.8 0 17.1 3.6 28.6 10.8 38.5 7.2 10 17.3 14.9 30.2 14.9 12.9 0 23-5 30.2-14.9 7.2-10 10.8-21.4 10.8-38.5zm127.1 86.4c-64.1.3-64.1-51.8-64.1-60.1L1051 32l39.1-6.2v183.6c0 4.7 0 34.5 25.1 34.6v32.9zm68.9 0h-39.3V108.1l39.3-6.2v175zm-19.7-193.5c13.1 0 23.8-10.6 23.8-23.7S1177.6 36 1164.4 36s-23.8 10.6-23.8 23.7 10.7 23.7 23.8 23.7zm117.4 18.6c12.9 0 23.8 1.6 32.6 4.8 8.8 3.2 15.9 7.7 21.1 13.4s8.9 13.5 11.1 21.7c2.3 8.2 3.4 17.2 3.4 27.1v100.6c-6 1.3-15.1 2.8-27.3 4.6s-25.9 2.7-41.1 2.7c-10.1 0-19.4-1-27.7-2.9-8.4-1.9-15.5-5-21.5-9.3-5.9-4.3-10.5-9.8-13.9-16.6-3.3-6.8-5-16.4-5-26.4 0-9.6 1.9-15.7 5.6-22.3 3.8-6.6 8.9-12 15.3-16.2 6.5-4.2 13.9-7.2 22.4-9s17.4-2.7 26.6-2.7c4.3 0 8.8.3 13.6.8s9.8 1.4 15.2 2.7v-6.4c0-4.5-.5-8.8-1.6-12.8-1.1-4.1-3-7.6-5.6-10.7-2.7-3.1-6.2-5.5-10.6-7.2s-10-3-16.7-3c-9 0-17.2 1.1-24.7 2.4-7.5 1.3-13.7 2.8-18.4 4.5l-4.7-32.1c4.9-1.7 12.2-3.4 21.6-5.1s19.5-2.6 30.3-2.6zm3.3 141.9c12 0 20.9-.7 27.1-1.9v-39.8c-2.2-.6-5.3-1.3-9.4-1.9-4.1-.6-8.6-1-13.6-1-4.3 0-8.7.3-13.1 1-4.4.6-8.4 1.8-11.9 3.5s-6.4 4.1-8.5 7.2c-2.2 3.1-3.2 4.9-3.2 9.6 0 9.2 3.2 14.5 9 18 5.9 3.6 13.7 5.3 23.6 5.3zM512.9 103c12.9 0 23.8 1.6 32.6 4.8 8.8 3.2 15.9 7.7 21.1 13.4 5.3 5.8 8.9 13.5 11.1 21.7 2.3 8.2 3.4 17.2 3.4 27.1v100.6c-6 1.3-15.1 2.8-27.3 4.6-12.2 1.8-25.9 2.7-41.1 2.7-10.1 0-19.4-1-27.7-2.9-8.4-1.9-15.5-5-21.5-9.3-5.9-4.3-10.5-9.8-13.9-16.6-3.3-6.8-5-16.4-5-26.4 0-9.6 1.9-15.7 5.6-22.3 3.8-6.6 8.9-12 15.3-16.2 6.5-4.2 13.9-7.2 22.4-9s17.4-2.7 26.6-2.7c4.3 0 8.8.3 13.6.8 4.7.5 9.8 1.4 15.2 2.7v-6.4c0-4.5-.5-8.8-1.6-12.8-1.1-4.1-3-7.6-5.6-10.7-2.7-3.1-6.2-5.5-10.6-7.2-4.4-1.7-10-3-16.7-3-9 0-17.2 1.1-24.7 2.4-7.5 1.3-13.7 2.8-18.4 4.5l-4.7-32.1c4.9-1.7 12.2-3.4 21.6-5.1 9.4-1.8 19.5-2.6 30.3-2.6zm3.4 142c12 0 20.9-.7 27.1-1.9v-39.8c-2.2-.6-5.3-1.3-9.4-1.9-4.1-.6-8.6-1-13.6-1-4.3 0-8.7.3-13.1 1-4.4.6-8.4 1.8-11.9 3.5s-6.4 4.1-8.5 7.2c-2.2 3.1-3.2 4.9-3.2 9.6 0 9.2 3.2 14.5 9 18s13.7 5.3 23.6 5.3zm158.5 31.9c-64.1.3-64.1-51.8-64.1-60.1L610.6 32l39.1-6.2v183.6c0 4.7 0 34.5 25.1 34.6v32.9z"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 4.3 KiB |
BIN
source/img/alipay.jpg
Normal file
BIN
source/img/alipay.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 68 KiB |
BIN
source/img/avatar.png
Normal file
BIN
source/img/avatar.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 433 KiB |
BIN
source/img/comment_bg.png
Normal file
BIN
source/img/comment_bg.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 25 KiB |
BIN
source/img/donate1.png
Normal file
BIN
source/img/donate1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 278 B |
BIN
source/img/donate2.png
Normal file
BIN
source/img/donate2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 359 B |
BIN
source/img/donate3.png
Normal file
BIN
source/img/donate3.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 361 B |
BIN
source/img/favicon.ico
Normal file
BIN
source/img/favicon.ico
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 15 KiB |
BIN
source/img/friend_404.gif
Normal file
BIN
source/img/friend_404.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 64 KiB |
BIN
source/img/wechat.jpg
Normal file
BIN
source/img/wechat.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 106 KiB |
1
source/js/activate-power-mode.js
Normal file
1
source/js/activate-power-mode.js
Normal file
@@ -0,0 +1 @@
|
||||
!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.POWERMODE=e():t.POWERMODE=e()}(this,function(){return function(o){var n={};function r(t){if(n[t])return n[t].exports;var e=n[t]={exports:{},id:t,loaded:!1};return o[t].call(e.exports,e,e.exports,r),e.loaded=!0,e.exports}return r.m=o,r.c=n,r.p="",r(0)}([function(t,e,l){"use strict";var r=document.createElement("canvas");r.width=window.innerWidth,r.height=window.innerHeight,r.style.cssText="position:fixed;top:0;left:0;pointer-events:none;z-index:999999",window.addEventListener("resize",function(){r.width=window.innerWidth,r.height=window.innerHeight}),document.body.appendChild(r);var i=r.getContext("2d"),c=[],u=0,p=!1;function o(t,e){return Math.random()*(e-t)+t}function f(t){if(h.colorful){var e=o(0,360);return"hsla("+o(e-10,e+10)+", 100%, "+o(50,80)+"%, 1)"}return window.getComputedStyle(t).color}function h(){for(var t=function(){var t,e=document.activeElement;if("TEXTAREA"===e.tagName||"INPUT"===e.tagName&&"text"===e.getAttribute("type")){var o=l(1)(e,e.selectionEnd);return t=e.getBoundingClientRect(),{x:o.left+t.left,y:o.top+t.top,color:f(e)}}var n=window.getSelection();if(n.rangeCount){var r=n.getRangeAt(0),i=r.startContainer;return i.nodeType===document.TEXT_NODE&&(i=i.parentNode),{x:(t=r.getBoundingClientRect()).left,y:t.top,color:f(i)}}return{x:0,y:0,color:"transparent"}}(),e=5+Math.round(10*Math.random());e--;)c[u]=(o=t.x,n=t.y,r=t.color,{x:o,y:n,alpha:1,color:r,velocity:{x:2*Math.random()-1,y:2*Math.random()-3.5}}),u=(u+1)%500;var o,n,r;if(h.shake){var i=1+2*Math.random(),a=i*(.5<Math.random()?-1:1),d=i*(.5<Math.random()?-1:1);document.body.style.marginLeft=a+"px",document.body.style.marginTop=d+"px",setTimeout(function(){document.body.style.marginLeft="",document.body.style.marginTop=""},75)}p||requestAnimationFrame(s)}function s(){p=!0,i.clearRect(0,0,r.width,r.height);for(var t=!1,e=r.getBoundingClientRect(),o=0;o<c.length;++o){var n=c[o];n.alpha<=.1||(n.velocity.y+=.075,n.x+=n.velocity.x,n.y+=n.velocity.y,n.alpha*=.96,i.globalAlpha=n.alpha,i.fillStyle=n.color,i.fillRect(Math.round(n.x-1.5)-e.left,Math.round(n.y-1.5)-e.top,3,3),t=!0)}t?requestAnimationFrame(s):p=!1}h.shake=!0,h.colorful=!1,t.exports=h},function(e,t){!function(){var u=["direction","boxSizing","width","height","overflowX","overflowY","borderTopWidth","borderRightWidth","borderBottomWidth","borderLeftWidth","borderStyle","paddingTop","paddingRight","paddingBottom","paddingLeft","fontStyle","fontVariant","fontWeight","fontStretch","fontSize","fontSizeAdjust","lineHeight","fontFamily","textAlign","textTransform","textIndent","textDecoration","letterSpacing","wordSpacing","tabSize","MozTabSize"],p=null!=window.mozInnerScreenX;function t(t,e,o){var n=o&&o.debug||!1;if(n){var r=document.querySelector("#input-textarea-caret-position-mirror-div");r&&r.parentNode.removeChild(r)}var i=document.createElement("div");i.id="input-textarea-caret-position-mirror-div",document.body.appendChild(i);var a=i.style,d=window.getComputedStyle?getComputedStyle(t):t.currentStyle;a.whiteSpace="pre-wrap","INPUT"!==t.nodeName&&(a.wordWrap="break-word"),a.position="absolute",n||(a.visibility="hidden"),u.forEach(function(t){a[t]=d[t]}),p?t.scrollHeight>parseInt(d.height)&&(a.overflowY="scroll"):a.overflow="hidden",i.textContent=t.value.substring(0,e),"INPUT"===t.nodeName&&(i.textContent=i.textContent.replace(/\s/g," "));var l=document.createElement("span");l.textContent=t.value.substring(e)||".",i.appendChild(l);var c={top:l.offsetTop+parseInt(d.borderTopWidth),left:l.offsetLeft+parseInt(d.borderLeftWidth)};return n?l.style.backgroundColor="#aaa":document.body.removeChild(i),c}void 0!==e&&void 0!==e.exports?e.exports=t:window.getCaretCoordinates=t}()}])});
|
||||
12
source/js/baidupush.js
Normal file
12
source/js/baidupush.js
Normal file
@@ -0,0 +1,12 @@
|
||||
(function(){
|
||||
var bp = document.createElement('script');
|
||||
var curProtocol = window.location.protocol.split(':')[0];
|
||||
if (curProtocol === 'https') {
|
||||
bp.src = 'https://zz.bdstatic.com/linksubmit/push.js';
|
||||
}
|
||||
else {
|
||||
bp.src = 'http://push.zhanzhang.baidu.com/push.js';
|
||||
}
|
||||
var s = document.getElementsByTagName("script")[0];
|
||||
s.parentNode.insertBefore(bp, s);
|
||||
})();
|
||||
513
source/js/main.js
Normal file
513
source/js/main.js
Normal file
@@ -0,0 +1,513 @@
|
||||
$(function () {
|
||||
if ($(".sidebar-toc__content").children().length > 0 ) {
|
||||
$(".layout_post").animate({}, function () {
|
||||
{
|
||||
setTimeout(function () {
|
||||
$('#page-header').addClass('open-sidebar')
|
||||
$("#toggle-sidebar").addClass('on')
|
||||
$('body').animate({
|
||||
paddingLeft: 300
|
||||
}, 200)
|
||||
$('#sidebar').animate({}, function () {
|
||||
$('#sidebar').css({
|
||||
'transform': 'translateX(300px)'
|
||||
},200)
|
||||
})
|
||||
$('#toggle-sidebar').animate({}, function () {
|
||||
$('#toggle-sidebar').css({
|
||||
'transform': 'rotateZ(180deg)',
|
||||
'color': '#99a9bf',
|
||||
'opacity': "1"
|
||||
})
|
||||
})
|
||||
|
||||
}, 200);
|
||||
}
|
||||
})
|
||||
}
|
||||
else
|
||||
$("#toggle-sidebar").css("display", "none")
|
||||
|
||||
|
||||
//-------------------------------------------------------------------------------------------------------
|
||||
//sidebar
|
||||
$('#toggle-sidebar').on('click', function () {
|
||||
|
||||
if (!isMobile() && $('#sidebar').is(':visible')) {
|
||||
var isOpen = $(this).hasClass('on')
|
||||
isOpen ? $(this).removeClass('on') : $(this).addClass('on')
|
||||
if (isOpen) {
|
||||
$('#page-header').removeClass('open-sidebar')
|
||||
$('body').animate({
|
||||
paddingLeft: 0
|
||||
}, 200)
|
||||
|
||||
$('#sidebar').animate({}, function () {
|
||||
$('#sidebar').css({
|
||||
'transform': 'translateX(0px)'
|
||||
})
|
||||
})
|
||||
|
||||
$('#toggle-sidebar').animate({}, function () {
|
||||
$('#toggle-sidebar').css({
|
||||
'transform': 'rotateZ(0deg)',
|
||||
'color': '#1F2D3D'
|
||||
})
|
||||
})
|
||||
|
||||
} else {
|
||||
$('#page-header').addClass('open-sidebar')
|
||||
$('body').animate({
|
||||
paddingLeft: 300
|
||||
}, 200)
|
||||
$('#sidebar').animate({}, function () {
|
||||
$('#sidebar').css({
|
||||
'transform': 'translateX(300px)'
|
||||
})
|
||||
})
|
||||
$('#toggle-sidebar').animate({}, function () {
|
||||
$('#toggle-sidebar').css({
|
||||
'transform': 'rotateZ(180deg)',
|
||||
'color': '#99a9bf'
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
//-----------------------------------------------------------------------------------------------------
|
||||
// 首页fullpage添加
|
||||
// 添加class
|
||||
if (/Android|webOS|iPhone|iPod|iPad|BlackBerry/i.test(navigator.userAgent)) {
|
||||
} else {
|
||||
$('.full_page').css('background-attachment', 'fixed')
|
||||
}
|
||||
|
||||
//---------------------------------------------------------------------------------------------------------
|
||||
//側邊欄comment
|
||||
$("#to_comment").on("click", function () {
|
||||
|
||||
scrollTo('#post-comment')
|
||||
|
||||
});
|
||||
|
||||
$(".scroll-down").on("click", function () {
|
||||
|
||||
scrollTo('#content-outer')
|
||||
|
||||
});
|
||||
|
||||
|
||||
//--------------------------------------------------------------------------------------------------------
|
||||
// tags 隨機大小 顔色
|
||||
var list = document.querySelectorAll(".tag-cloud .tag-cloud-tags a");
|
||||
|
||||
if ($(window).width() > 768) {
|
||||
Array.prototype.forEach.call(list, (item, index) => {
|
||||
item.style.fontSize = Math.floor(Math.random() * 20 + 15) + "px"; //15 ~ 35
|
||||
item.style.color =
|
||||
"rgb(" +
|
||||
Math.floor(Math.random() * 201) +
|
||||
", " +
|
||||
Math.floor(Math.random() * 201) +
|
||||
", " +
|
||||
Math.floor(Math.random() * 201) +
|
||||
")"; // 0,0,0 -> 200,200,200
|
||||
});
|
||||
} else {
|
||||
Array.prototype.forEach.call(list, (item, index) => {
|
||||
item.style.fontSize = Math.floor(Math.random() * 13 + 15) + "px"; //15 ~ 28
|
||||
item.style.color =
|
||||
"rgb(" +
|
||||
Math.floor(Math.random() * 201) +
|
||||
", " +
|
||||
Math.floor(Math.random() * 201) +
|
||||
", " +
|
||||
Math.floor(Math.random() * 201) +
|
||||
")"; // 0,0,0 -> 200,200,200
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
//--------------------------------------------------------------------------------------------------------
|
||||
// bookmark
|
||||
$.fancyConfirm = function (opts) {
|
||||
opts = $.extend(true, {
|
||||
title: 'Are you sure?',
|
||||
message: '',
|
||||
okButton: 'OK',
|
||||
noButton: 'Cancel',
|
||||
callback: $.noop
|
||||
}, opts || {});
|
||||
|
||||
$.fancybox.open({
|
||||
type: 'html',
|
||||
src:
|
||||
'<div class="fc-content">' +
|
||||
'<h3>' + opts.title + '</h3>' +
|
||||
'<p>' + opts.message + '</p>' +
|
||||
'<p class="tright">' +
|
||||
'<button data-value="1" data-fancybox-close class="bookmark-ok">' + opts.okButton + '</button>' +
|
||||
'</p>' +
|
||||
'</div>',
|
||||
opts: {
|
||||
animationDuration: 350,
|
||||
animationEffect: 'material',
|
||||
modal: true,
|
||||
baseTpl:
|
||||
'<div class="fancybox-container fc-container" role="dialog" tabindex="-1">' +
|
||||
'<div class="fancybox-bg"></div>' +
|
||||
'<div class="fancybox-inner">' +
|
||||
'<div class="fancybox-stage"></div>' +
|
||||
'</div>' +
|
||||
'</div>',
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
$('#bookmark-it').click(
|
||||
function () {
|
||||
if (window.sidebar && window.sidebar.addPanel) { // Mozilla Firefox Bookmark
|
||||
window.sidebar.addPanel(document.title, window.location.href, '');
|
||||
} else if (window.external && ('AddFavorite' in window.external)) { // IE Favorite
|
||||
window.external.AddFavorite(location.href, document.title);
|
||||
} else if (window.opera && window.print) { // Opera Hotlist
|
||||
this.title = document.title;
|
||||
return true;
|
||||
} else { // webkit - safari/chrome
|
||||
// alert('按 ' + (navigator.userAgent.toLowerCase().indexOf('mac') != -1 ? 'Command/Cmd' : 'CTRL') + ' + D 鍵將本頁加入書籤.');
|
||||
$.fancyConfirm({
|
||||
title: "添加書籤？",
|
||||
message:
|
||||
'按 ' + (navigator.userAgent.toLowerCase().indexOf('mac') != -1 ? 'Command/Cmd' : 'CTRL') + ' + D 鍵將本頁加入書籤.',
|
||||
okButton: "OK",
|
||||
});
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
//-------------------------------------------------------------------------------------------------------
|
||||
//代码copy
|
||||
// Add copy icon
|
||||
// $('figure.highlight').wrap('<div class="code-area-wrap"></div>')
|
||||
// var $copyIcon = $('<i class="fa fa-clipboard" aria-hidden="true"></i>')
|
||||
// var $notice = $('<div class="copy-notice"></div>')
|
||||
// $('.code-area-wrap').prepend($copyIcon)
|
||||
// $('.code-area-wrap').prepend($notice)
|
||||
// // copy function
|
||||
// function copy(text, ctx) {
|
||||
// if (document.queryCommandSupported && document.queryCommandSupported('copy')) {
|
||||
// try {
|
||||
// document.execCommand('copy') // Security exception may be thrown by some browsers.
|
||||
// $(ctx).prev('.copy-notice')
|
||||
// .text(GLOBAL_CONFIG.copy.success)
|
||||
// .velocity({
|
||||
// translateX: -30,
|
||||
// opacity: 1
|
||||
// }, {
|
||||
// loop: 1,
|
||||
// duration: 750,
|
||||
// easing: 'easeOutQuint'
|
||||
// })
|
||||
// } catch (ex) {
|
||||
// $(ctx).prev('.copy-notice')
|
||||
// .text(GLOBAL_CONFIG.copy.error)
|
||||
// .velocity({
|
||||
// translateX: -30,
|
||||
// opacity: 1
|
||||
// }, {
|
||||
// loop: 1,
|
||||
// duration: 750,
|
||||
// easing: 'easeOutQuint'
|
||||
// })
|
||||
// return false
|
||||
// }
|
||||
// } else {
|
||||
// $(ctx).prev('.copy-notice').text(GLOBAL_CONFIG.copy.noSupport)
|
||||
// }
|
||||
// }
|
||||
// // click events
|
||||
// $('.code-area-wrap .fa-clipboard').on('click', function () {
|
||||
// var selection = window.getSelection()
|
||||
// var range = document.createRange()
|
||||
// range.selectNodeContents($(this).siblings('figure').find('.code pre')[0])
|
||||
// selection.removeAllRanges()
|
||||
// selection.addRange(range)
|
||||
// var text = selection.toString()
|
||||
// copy(text, this)
|
||||
// selection.removeAllRanges()
|
||||
// })
|
||||
|
||||
//---------------------------------------------------------------------------------------------------
|
||||
//fancybox
|
||||
var imgList = $(".recent-post-info img");
|
||||
if (imgList.length === 0) {
|
||||
imgList = $("#post-content img");
|
||||
}
|
||||
for (var i = 0; i < imgList.length; i++) {
|
||||
var $a = $(
|
||||
'<a href="' +
|
||||
imgList[i].src +
|
||||
'" data-fancybox="group" data-caption="' +
|
||||
imgList[i].alt +
|
||||
'" class="fancybox"></a>'
|
||||
);
|
||||
var alt = imgList[i].alt;
|
||||
var $wrap = $(imgList[i]).wrap($a);
|
||||
if (alt) {
|
||||
$wrap.after('<div class="img-alt">' + alt + "</div>");
|
||||
}
|
||||
}
|
||||
|
||||
$().fancybox({
|
||||
selector: "[data-fancybox]",
|
||||
loop: true,
|
||||
transitionEffect: "slide",
|
||||
protect: true,
|
||||
// wheel: false,
|
||||
buttons: ["slideShow", "fullScreen", "thumbs", "close"]
|
||||
});
|
||||
|
||||
var galleryItem = $(".gallery-item");
|
||||
var galleryList = [];
|
||||
galleryItem.each(function (idx, elem) {
|
||||
galleryList.push({
|
||||
src: $(elem).data("url"),
|
||||
opts: {
|
||||
caption: $(elem).data("title")
|
||||
}
|
||||
});
|
||||
});
|
||||
galleryItem.on("click", function () {
|
||||
$.fancybox.open(
|
||||
galleryList, {
|
||||
loop: true,
|
||||
transitionEffect: "slide"
|
||||
},
|
||||
galleryItem.index(this)
|
||||
);
|
||||
return false;
|
||||
|
||||
});
|
||||
|
||||
//--------------------------------------------------------------------------------------------------------
|
||||
//lazy懶加載
|
||||
//把img的src删除，添加data-src,用于lozad.js
|
||||
var $img = $("#post img");
|
||||
$img.addClass("lozad");
|
||||
$img.each(function () {
|
||||
var src_link = $(this).attr("src");
|
||||
$(this).attr("data-src", src_link);
|
||||
$(this).removeAttr("src");
|
||||
})
|
||||
|
||||
const observer = lozad(); // lazy loads elements with default selector as '.lozad'
|
||||
observer.observe();
|
||||
|
||||
//---------------------------------------------------------------------------------------------------------
|
||||
/** head点击*/
|
||||
$('.toggle-menu').on('click', function () {
|
||||
if (!$('.menus').is(':visible')) {
|
||||
$(".toggle-menu").removeClass("open").addClass("close");
|
||||
$('.menus').slideDown(300)
|
||||
} else {
|
||||
$(".toggle-menu").removeClass("close").addClass("open");
|
||||
$('.menus').slideUp(200)
|
||||
}
|
||||
})
|
||||
|
||||
$(document).on('click touchstart', function (e) {
|
||||
var flag = $('.menus')[0].contains(e.target) || $('.toggle-menu')[0].contains(e.target)
|
||||
if (!flag && $('.toggle-menu').is(':visible')) {
|
||||
$(".toggle-menu").removeClass("close").addClass("open");
|
||||
$('.menus').slideUp(200)
|
||||
}
|
||||
})
|
||||
|
||||
|
||||
$(window).on('resize', function (e) {
|
||||
if (!$('.toggle-menu').is(':visible')) {
|
||||
if (!$('.menus').is(':visible')) {
|
||||
$(".toggle-menu").removeClass("open").addClass("close");
|
||||
$('.menus').slideDown(300)
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
//---------------------------------------------------------------------------------------------------------
|
||||
/** scroll 滚动 toc*/
|
||||
var initTop = 0
|
||||
$('.toc-child').hide()
|
||||
|
||||
// main of scroll
|
||||
$(window).scroll(throttle(function (event) {
|
||||
var currentTop = $(this).scrollTop()
|
||||
if (!isMobile()) {
|
||||
// percentage inspired by hexo-theme-next
|
||||
scrollPercent(currentTop)
|
||||
// head position
|
||||
findHeadPosition(currentTop)
|
||||
}
|
||||
var isUp = scrollDirection(currentTop)
|
||||
if (currentTop > 56) {
|
||||
if (isUp) {
|
||||
$('#page-header').hasClass('visible') ? $('#page-header').removeClass('visible') : console.log()
|
||||
} else {
|
||||
$('#page-header').hasClass('visible') ? console.log() : $('#page-header').addClass('visible')
|
||||
}
|
||||
$('#page-header').addClass('fixed')
|
||||
if ($('#go-up').css('opacity') === '0') {
|
||||
|
||||
$('#go-up').animate({}, function () {
|
||||
$('#go-up').css({
|
||||
'opacity': '1',
|
||||
'transform': 'translateX(-30px) rotateZ(360deg)'
|
||||
})
|
||||
})
|
||||
}
|
||||
if ($('#rightside').css('opacity') === '0') {
|
||||
|
||||
$('#rightside').animate({}, function () {
|
||||
$('#rightside').css({
|
||||
'opacity': '1',
|
||||
'transform': 'translateX(-38px)'
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
} else {
|
||||
if (currentTop === 0) {
|
||||
$('#page-header').removeClass('fixed').removeClass('visible')
|
||||
}
|
||||
|
||||
$('#go-up').animate({}, function () {
|
||||
$('#go-up').css({
|
||||
'opacity': '0',
|
||||
'transform': 'translateX(0) rotateZ(180deg) '
|
||||
})
|
||||
})
|
||||
|
||||
$('#rightside').animate({}, function () {
|
||||
$('#rightside').css({
|
||||
'opacity': '0',
|
||||
'transform': 'translateX(0)'
|
||||
})
|
||||
})
|
||||
|
||||
}
|
||||
}, 50, 100))
|
||||
|
||||
// go up smooth scroll
|
||||
$('#go-up').on('click', function () {
|
||||
scrollTo('body')
|
||||
})
|
||||
|
||||
// head scroll
|
||||
$('#post-content').find('h1,h2,h3,h4,h5,h6').on('click', function (e) {
|
||||
scrollToHead('#' + $(this).attr('id'))
|
||||
})
|
||||
|
||||
// head scroll
|
||||
$('.toc-link').on('click', function (e) {
|
||||
e.preventDefault()
|
||||
scrollToHead($(this).attr('href'))
|
||||
})
|
||||
|
||||
// find the scroll direction
|
||||
function scrollDirection(currentTop) {
|
||||
var result = currentTop > initTop // true is down & false is up
|
||||
initTop = currentTop
|
||||
return result
|
||||
}
|
||||
|
||||
// scroll to a head(anchor)
|
||||
function scrollToHead(anchor) {
|
||||
scrollTo(anchor);
|
||||
}
|
||||
|
||||
// expand toc-item
|
||||
function expandToc($item) {
|
||||
if ($item.is(':visible')) {
|
||||
return
|
||||
}
|
||||
$item.fadeIn(400)
|
||||
}
|
||||
|
||||
function scrollPercent(currentTop) {
|
||||
var docHeight = $('#content-outer').height()
|
||||
var winHeight = $(window).height()
|
||||
var contentMath = (docHeight > winHeight) ? (docHeight - winHeight) : ($(document).height() - winHeight)
|
||||
var scrollPercent = (currentTop) / (contentMath)
|
||||
var scrollPercentRounded = Math.round(scrollPercent * 100)
|
||||
var percentage = (scrollPercentRounded > 100) ? 100 : scrollPercentRounded
|
||||
$('.progress-num').text(percentage)
|
||||
$('.sidebar-toc__progress-bar').animate({
|
||||
width: percentage + '%'
|
||||
}, 100)
|
||||
}
|
||||
|
||||
function updateAnchor(anchor) {
|
||||
if (window.history.replaceState && anchor !== window.location.hash) {
|
||||
window.history.replaceState(undefined, undefined, anchor)
|
||||
}
|
||||
}
|
||||
|
||||
// find head position & add active class
|
||||
// DOM Hierarchy:
|
||||
// ol.toc > (li.toc-item, ...)
|
||||
// li.toc-item > (a.toc-link, ol.toc-child > (li.toc-item, ...))
|
||||
function findHeadPosition(top) {
|
||||
// assume that we are not in the post page if no TOC link be found,
|
||||
// thus no need to update the status
|
||||
if ($('.toc-link').length === 0) {
|
||||
return false
|
||||
}
|
||||
|
||||
var list = $('#post-content').find('h1,h2,h3,h4,h5,h6')
|
||||
var currentId = ''
|
||||
list.each(function () {
|
||||
var head = $(this)
|
||||
if (top > head.offset().top - 25) {
|
||||
currentId = '#' + $(this).attr('id')
|
||||
}
|
||||
})
|
||||
|
||||
if (currentId === '') {
|
||||
$('.toc-link').removeClass('active')
|
||||
$('.toc-child').hide()
|
||||
}
|
||||
|
||||
var currentActive = $('.toc-link.active')
|
||||
if (currentId && currentActive.attr('href') !== currentId) {
|
||||
updateAnchor(currentId)
|
||||
|
||||
$('.toc-link').removeClass('active')
|
||||
var _this = $('.toc-link[href="' + currentId + '"]')
|
||||
_this.addClass('active')
|
||||
|
||||
var parents = _this.parents('.toc-child')
|
||||
// Returned list is in reverse order of the DOM elements
|
||||
// Thus `parents.last()` is the outermost .toc-child container
|
||||
// i.e. list of subsections
|
||||
var topLink = (parents.length > 0) ? parents.last() : _this
|
||||
expandToc(topLink.closest('.toc-item').find('.toc-child'))
|
||||
topLink
|
||||
// Find all top-level .toc-item containers, i.e. sections
|
||||
// excluding the currently active one
|
||||
.closest('.toc-item').siblings('.toc-item')
|
||||
// Hide their respective list of subsections
|
||||
.find('.toc-child').hide()
|
||||
}
|
||||
}
|
||||
|
||||
//代碼框雙擊全屏
|
||||
$('figure').on('dblclick', function(e) {
|
||||
if (e.target !== this)
|
||||
return;
|
||||
$(this).toggleClass('code_full_page');
|
||||
$('body').toggleClass('code_body');
|
||||
});
|
||||
|
||||
|
||||
});
|
||||
28
source/js/nightshift.js
Normal file
28
source/js/nightshift.js
Normal file
@@ -0,0 +1,28 @@
|
||||
$(function() {
|
||||
changeReadModel();
|
||||
|
||||
function switchReadMode() {
|
||||
var next_mode = $("body").hasClass("night-mode") ? "day" : "night";
|
||||
Cookies.set("read-mode", next_mode, {expires: 7, path: '/'});
|
||||
changeReadModel();
|
||||
}
|
||||
|
||||
function changeReadModel() {
|
||||
if (Cookies.get("read-mode") == "night") {
|
||||
$("body").addClass("night-mode");
|
||||
$("#nightshift").removeClass("fa-moon-o").addClass("fa-sun-o");
|
||||
}
|
||||
|
||||
// 非夜間模式
|
||||
if (Cookies.get("read-mode") == "day") {
|
||||
$("body").removeClass("night-mode");
|
||||
$("#nightshift").removeClass("fa-sun-o").addClass("fa-moon-o");
|
||||
}
|
||||
}
|
||||
|
||||
$("#nightshift").click(function() {
|
||||
switchReadMode();
|
||||
});
|
||||
|
||||
|
||||
});
|
||||
21
source/js/runtimeshow.js
Normal file
21
source/js/runtimeshow.js
Normal file
@@ -0,0 +1,21 @@
|
||||
function show_date_time(){
|
||||
window.setTimeout("show_date_time()", 1000);
|
||||
BirthDay=new Date("6/7/2018 00:00:00");//這個日期是可以修改的
|
||||
today=new Date();
|
||||
timeold=(today.getTime()-BirthDay.getTime());//其實僅僅改了這裏
|
||||
// sectimeold=timeold/1000
|
||||
// secondsold=Math.floor(sectimeold);
|
||||
msPerDay=24*60*60*1000
|
||||
e_daysold=timeold/msPerDay
|
||||
daysold=Math.floor(e_daysold);
|
||||
// e_hrsold=(e_daysold-daysold)*24;
|
||||
// hrsold=Math.floor(e_hrsold);
|
||||
// e_minsold=(e_hrsold-hrsold)*60;
|
||||
// minsold=Math.floor((e_hrsold-hrsold)*60);
|
||||
// seconds=Math.floor((e_minsold-minsold)*60);
|
||||
// span_dt_dt.innerHTML = "已運行 " + daysold + " 天 " + hrsold + " 時 " + minsold + " 分 " + seconds + " 秒";
|
||||
webinfo_runtime_count.innerHTML= daysold + " 天"
|
||||
}
|
||||
|
||||
show_date_time()
|
||||
|
||||
136
source/js/search/algolia.js
Normal file
136
source/js/search/algolia.js
Normal file
@@ -0,0 +1,136 @@
|
||||
$(function () {
|
||||
$('a.social-icon.search').on('click', function () {
|
||||
$('body').css('width', '100%')
|
||||
$('body').css('overflow', 'hidden')
|
||||
|
||||
$('.search-dialog').animate({}, function () {
|
||||
$('.search-dialog').css({
|
||||
'display': 'block',
|
||||
'animation': 'titlescale 0.5s'
|
||||
})
|
||||
})
|
||||
|
||||
$('.ais-search-box--input').focus()
|
||||
$('.search-mask').fadeIn();
|
||||
// shortcut: ESC
|
||||
document.addEventListener('keydown', function f(event) {
|
||||
if (event.code == "Escape") {
|
||||
closeSearch();
|
||||
document.removeEventListener('keydown', f);
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
var closeSearch = function () {
|
||||
$('body').css('overflow', 'auto')
|
||||
|
||||
$('.search-dialog').animate({}, function () {
|
||||
$('.search-dialog').css({
|
||||
'display': 'none'
|
||||
})
|
||||
})
|
||||
|
||||
$('.search-mask').fadeOut();
|
||||
}
|
||||
$('.search-mask, .search-close-button').on('click', closeSearch)
|
||||
|
||||
|
||||
var algolia = GLOBAL_CONFIG.algolia
|
||||
var isAlgoliaValid = algolia.appId && algolia.apiKey && algolia.indexName
|
||||
if (!isAlgoliaValid) {
|
||||
return console.error('Algolia setting is invalid!')
|
||||
}
|
||||
|
||||
var search = instantsearch({
|
||||
appId: algolia.appId,
|
||||
apiKey: algolia.apiKey,
|
||||
indexName: algolia.indexName,
|
||||
searchParameters: {
|
||||
hitsPerPage: algolia.hits.per_page || 10
|
||||
},
|
||||
searchFunction: function (helper) {
|
||||
var searchInput = $('#algolia-search-input').find('input')
|
||||
|
||||
if (searchInput.val()) {
|
||||
helper.search()
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
search.addWidget(
|
||||
instantsearch.widgets.searchBox({
|
||||
container: '#algolia-search-input',
|
||||
reset: false,
|
||||
magnifier: false,
|
||||
placeholder: GLOBAL_CONFIG.algolia.languages.input_placeholder
|
||||
})
|
||||
)
|
||||
search.addWidget(
|
||||
instantsearch.widgets.hits({
|
||||
container: '#algolia-hits',
|
||||
templates: {
|
||||
item: function (data) {
|
||||
var link = data.permalink ? data.permalink : (GLOBAL_CONFIG.root + data.path)
|
||||
return (
|
||||
'<a href="' + link + '" class="algolia-hit-item-link">' +
|
||||
data._highlightResult.title.value +
|
||||
'</a>'
|
||||
)
|
||||
},
|
||||
empty: function (data) {
|
||||
return (
|
||||
'<div id="algolia-hits-empty">' +
|
||||
GLOBAL_CONFIG.algolia.languages.hits_empty.replace(/\$\{query}/, data.query) +
|
||||
'</div>'
|
||||
)
|
||||
}
|
||||
},
|
||||
cssClasses: {
|
||||
item: 'algolia-hit-item'
|
||||
}
|
||||
})
|
||||
)
|
||||
|
||||
search.addWidget(
|
||||
instantsearch.widgets.stats({
|
||||
container: '#algolia-stats',
|
||||
templates: {
|
||||
body: function (data) {
|
||||
var stats = GLOBAL_CONFIG.algolia.languages.hits_stats
|
||||
.replace(/\$\{hits}/, data.nbHits)
|
||||
.replace(/\$\{time}/, data.processingTimeMS)
|
||||
return (
|
||||
'<hr>' +
|
||||
stats +
|
||||
'<span class="algolia-logo pull-right">' +
|
||||
' <img src="' + GLOBAL_CONFIG.root + 'img/algolia.svg" alt="Algolia" />' +
|
||||
'</span>'
|
||||
)
|
||||
}
|
||||
}
|
||||
})
|
||||
)
|
||||
|
||||
search.addWidget(
|
||||
instantsearch.widgets.pagination({
|
||||
container: '#algolia-pagination',
|
||||
scrollTo: false,
|
||||
showFirstLast: false,
|
||||
labels: {
|
||||
first: '<i class="fa fa-angle-double-left"></i>',
|
||||
last: '<i class="fa fa-angle-double-right"></i>',
|
||||
previous: '<i class="fa fa-angle-left"></i>',
|
||||
next: '<i class="fa fa-angle-right"></i>'
|
||||
},
|
||||
cssClasses: {
|
||||
root: 'pagination',
|
||||
item: 'pagination-item',
|
||||
link: 'page-number',
|
||||
active: 'current',
|
||||
disabled: 'disabled-item'
|
||||
}
|
||||
})
|
||||
)
|
||||
|
||||
search.start()
|
||||
})
|
||||
102
source/js/search/local-search.js
Normal file
102
source/js/search/local-search.js
Normal file
@@ -0,0 +1,102 @@
|
||||
$(function () {
|
||||
var loadFlag = false
|
||||
$('a.social-icon.search').on('click', function () {
|
||||
$('body').css('width', '100%')
|
||||
$('body').css('overflow', 'hidden')
|
||||
$('.search-dialog').animate({}, function () {
|
||||
$('.search-dialog').css({
|
||||
'display': 'block',
|
||||
'animation': 'titlescale 0.5s'
|
||||
})
|
||||
})
|
||||
$('#local-search-input input').focus()
|
||||
|
||||
$('.search-mask').fadeIn();
|
||||
if (!loadFlag) {
|
||||
search(GLOBAL_CONFIG.localSearch.path)
|
||||
loadFlag = true
|
||||
}
|
||||
|
||||
// shortcut: ESC
|
||||
document.addEventListener('keydown', function f(event) {
|
||||
if (event.code === 'Escape') {
|
||||
closeSearch()
|
||||
document.removeEventListener('keydown', f)
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
var closeSearch = function () {
|
||||
$('body').css('overflow', 'auto')
|
||||
$('.search-dialog').animate({}, function () {
|
||||
$('.search-dialog').css({
|
||||
'display': 'none'
|
||||
})
|
||||
})
|
||||
$('.search-mask').fadeOut();
|
||||
}
|
||||
$('.search-mask, .search-close-button').on('click', closeSearch)
|
||||
|
||||
function search(path) {
|
||||
$.ajax({
|
||||
url: GLOBAL_CONFIG.root + path,
|
||||
dataType: 'xml',
|
||||
success: function (xmlResponse) {
|
||||
// get the contents from search data
|
||||
var datas = $('entry', xmlResponse).map(function () {
|
||||
return {
|
||||
title: $('title', this).text(),
|
||||
content: $('content', this).text(),
|
||||
url: $('url', this).text()
|
||||
}
|
||||
}).get()
|
||||
var $input = $('#local-search-input input')[0]
|
||||
var $resultContent = $('#local-hits')[0]
|
||||
$input.addEventListener('input', function () {
|
||||
var str = '<div class="search-result-list">'
|
||||
var keywords = this.value.trim().toLowerCase().split(/[\s]+/)
|
||||
$resultContent.innerHTML = ''
|
||||
if (this.value.trim().length <= 0) {
|
||||
$('.local-search-stats__hr').hide()
|
||||
return
|
||||
}
|
||||
var count = 0
|
||||
// perform local searching
|
||||
datas.forEach(function (data) {
|
||||
var isMatch = true
|
||||
var dataTitle = data.title.trim().toLowerCase()
|
||||
var dataContent = data.content.trim().replace(/<[^>]+>/g, '').toLowerCase()
|
||||
var dataUrl = data.url
|
||||
var indexTitle = -1
|
||||
var indexContent = -1
|
||||
// only match artiles with not empty titles and contents
|
||||
if (dataTitle !== '' && dataContent !== '') {
|
||||
keywords.forEach(function (keyword, i) {
|
||||
indexTitle = dataTitle.indexOf(keyword)
|
||||
indexContent = dataContent.indexOf(keyword)
|
||||
if (indexTitle < 0 && indexContent < 0) {
|
||||
isMatch = false
|
||||
} else {
|
||||
if (indexContent < 0) {
|
||||
indexContent = 0
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
// show search results
|
||||
if (isMatch) {
|
||||
str += '<div class="local-search__hit-item"><a href="' + dataUrl + '" class="search-result-title">' + dataTitle + '</a>' + '</div>'
|
||||
count += 1
|
||||
$('.local-search-stats__hr').show()
|
||||
}
|
||||
})
|
||||
if (count === 0) {
|
||||
str += '<div id="local-search__hits-empty">' + GLOBAL_CONFIG.localSearch.languages.hits_empty.replace(/\$\{query}/, this.value.trim()) +
|
||||
'</div>'
|
||||
}
|
||||
$resultContent.innerHTML = str
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
27
source/js/third-party/anime.min.js
vendored
Normal file
27
source/js/third-party/anime.min.js
vendored
Normal file
@@ -0,0 +1,27 @@
|
||||
/*
|
||||
2017 Julian Garnier
|
||||
Released under the MIT license
|
||||
*/
|
||||
var $jscomp$this=this;
|
||||
(function(v,p){"function"===typeof define&&define.amd?define([],p):"object"===typeof module&&module.exports?module.exports=p():v.anime=p()})(this,function(){function v(a){if(!g.col(a))try{return document.querySelectorAll(a)}catch(b){}}function p(a){return a.reduce(function(a,d){return a.concat(g.arr(d)?p(d):d)},[])}function w(a){if(g.arr(a))return a;g.str(a)&&(a=v(a)||a);return a instanceof NodeList||a instanceof HTMLCollection?[].slice.call(a):[a]}function F(a,b){return a.some(function(a){return a===b})}
|
||||
function A(a){var b={},d;for(d in a)b[d]=a[d];return b}function G(a,b){var d=A(a),c;for(c in a)d[c]=b.hasOwnProperty(c)?b[c]:a[c];return d}function B(a,b){var d=A(a),c;for(c in b)d[c]=g.und(a[c])?b[c]:a[c];return d}function S(a){a=a.replace(/^#?([a-f\d])([a-f\d])([a-f\d])$/i,function(a,b,d,h){return b+b+d+d+h+h});var b=/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(a);a=parseInt(b[1],16);var d=parseInt(b[2],16),b=parseInt(b[3],16);return"rgb("+a+","+d+","+b+")"}function T(a){function b(a,b,c){0>
|
||||
c&&(c+=1);1<c&&--c;return c<1/6?a+6*(b-a)*c:.5>c?b:c<2/3?a+(b-a)*(2/3-c)*6:a}var d=/hsl\((\d+),\s*([\d.]+)%,\s*([\d.]+)%\)/g.exec(a);a=parseInt(d[1])/360;var c=parseInt(d[2])/100,d=parseInt(d[3])/100;if(0==c)c=d=a=d;else{var e=.5>d?d*(1+c):d+c-d*c,l=2*d-e,c=b(l,e,a+1/3),d=b(l,e,a);a=b(l,e,a-1/3)}return"rgb("+255*c+","+255*d+","+255*a+")"}function x(a){if(a=/([\+\-]?[0-9#\.]+)(%|px|pt|em|rem|in|cm|mm|ex|pc|vw|vh|deg|rad|turn)?/.exec(a))return a[2]}function U(a){if(-1<a.indexOf("translate"))return"px";
|
||||
if(-1<a.indexOf("rotate")||-1<a.indexOf("skew"))return"deg"}function H(a,b){return g.fnc(a)?a(b.target,b.id,b.total):a}function C(a,b){if(b in a.style)return getComputedStyle(a).getPropertyValue(b.replace(/([a-z])([A-Z])/g,"$1-$2").toLowerCase())||"0"}function I(a,b){if(g.dom(a)&&F(V,b))return"transform";if(g.dom(a)&&(a.getAttribute(b)||g.svg(a)&&a[b]))return"attribute";if(g.dom(a)&&"transform"!==b&&C(a,b))return"css";if(null!=a[b])return"object"}function W(a,b){var d=U(b),d=-1<b.indexOf("scale")?
|
||||
1:0+d;a=a.style.transform;if(!a)return d;for(var c=[],e=[],l=[],h=/(\w+)\((.+?)\)/g;c=h.exec(a);)e.push(c[1]),l.push(c[2]);a=l.filter(function(a,c){return e[c]===b});return a.length?a[0]:d}function J(a,b){switch(I(a,b)){case "transform":return W(a,b);case "css":return C(a,b);case "attribute":return a.getAttribute(b)}return a[b]||0}function K(a,b){var d=/^(\*=|\+=|-=)/.exec(a);if(!d)return a;b=parseFloat(b);a=parseFloat(a.replace(d[0],""));switch(d[0][0]){case "+":return b+a;case "-":return b-a;case "*":return b*
|
||||
a}}function D(a){return g.obj(a)&&a.hasOwnProperty("totalLength")}function X(a,b){function d(c){c=void 0===c?0:c;return a.el.getPointAtLength(1<=b+c?b+c:0)}var c=d(),e=d(-1),l=d(1);switch(a.property){case "x":return c.x;case "y":return c.y;case "angle":return 180*Math.atan2(l.y-e.y,l.x-e.x)/Math.PI}}function L(a,b){var d=/-?\d*\.?\d+/g;a=D(a)?a.totalLength:a;if(g.col(a))b=g.rgb(a)?a:g.hex(a)?S(a):g.hsl(a)?T(a):void 0;else{var c=x(a);a=c?a.substr(0,a.length-c.length):a;b=b?a+b:a}b+="";return{original:b,
|
||||
numbers:b.match(d)?b.match(d).map(Number):[0],strings:b.split(d)}}function Y(a,b){return b.reduce(function(b,c,e){return b+a[e-1]+c})}function M(a){return(a?p(g.arr(a)?a.map(w):w(a)):[]).filter(function(a,d,c){return c.indexOf(a)===d})}function Z(a){var b=M(a);return b.map(function(a,c){return{target:a,id:c,total:b.length}})}function aa(a,b){var d=A(b);if(g.arr(a)){var c=a.length;2!==c||g.obj(a[0])?g.fnc(b.duration)||(d.duration=b.duration/c):a={value:a}}return w(a).map(function(a,c){c=c?0:b.delay;
|
||||
a=g.obj(a)&&!D(a)?a:{value:a};g.und(a.delay)&&(a.delay=c);return a}).map(function(a){return B(a,d)})}function ba(a,b){var d={},c;for(c in a){var e=H(a[c],b);g.arr(e)&&(e=e.map(function(a){return H(a,b)}),1===e.length&&(e=e[0]));d[c]=e}d.duration=parseFloat(d.duration);d.delay=parseFloat(d.delay);return d}function ca(a){return g.arr(a)?y.apply(this,a):N[a]}function da(a,b){var d;return a.tweens.map(function(c){c=ba(c,b);var e=c.value,l=J(b.target,a.name),h=d?d.to.original:l,h=g.arr(e)?e[0]:h,m=K(g.arr(e)?
|
||||
e[1]:e,h),l=x(m)||x(h)||x(l);c.isPath=D(e);c.from=L(h,l);c.to=L(m,l);c.start=d?d.end:a.offset;c.end=c.start+c.delay+c.duration;c.easing=ca(c.easing);c.elasticity=(1E3-Math.min(Math.max(c.elasticity,1),999))/1E3;g.col(c.from.original)&&(c.round=1);return d=c})}function ea(a,b){return p(a.map(function(a){return b.map(function(b){var c=I(a.target,b.name);if(c){var d=da(b,a);b={type:c,property:b.name,animatable:a,tweens:d,duration:d[d.length-1].end,delay:d[0].delay}}else b=void 0;return b})})).filter(function(a){return!g.und(a)})}
|
||||
function O(a,b,d){var c="delay"===a?Math.min:Math.max;return b.length?c.apply(Math,b.map(function(b){return b[a]})):d[a]}function fa(a){var b=G(ga,a),d=G(ha,a),c=Z(a.targets),e=[],g=B(b,d),h;for(h in a)g.hasOwnProperty(h)||"targets"===h||e.push({name:h,offset:g.offset,tweens:aa(a[h],d)});a=ea(c,e);return B(b,{children:[],animatables:c,animations:a,duration:O("duration",a,d),delay:O("delay",a,d)})}function n(a){function b(){return window.Promise&&new Promise(function(a){return Q=a})}function d(a){return f.reversed?
|
||||
f.duration-a:a}function c(a){for(var b=0,c={},d=f.animations,e={};b<d.length;){var g=d[b],h=g.animatable,m=g.tweens;e.tween=m.filter(function(b){return a<b.end})[0]||m[m.length-1];e.isPath$1=e.tween.isPath;e.round=e.tween.round;e.eased=e.tween.easing(Math.min(Math.max(a-e.tween.start-e.tween.delay,0),e.tween.duration)/e.tween.duration,e.tween.elasticity);m=Y(e.tween.to.numbers.map(function(a){return function(b,c){c=a.isPath$1?0:a.tween.from.numbers[c];b=c+a.eased*(b-c);a.isPath$1&&(b=X(a.tween.value,
|
||||
b));a.round&&(b=Math.round(b*a.round)/a.round);return b}}(e)),e.tween.to.strings);ia[g.type](h.target,g.property,m,c,h.id);g.currentValue=m;b++;e={isPath$1:e.isPath$1,tween:e.tween,eased:e.eased,round:e.round}}if(c)for(var k in c)E||(E=C(document.body,"transform")?"transform":"-webkit-transform"),f.animatables[k].target.style[E]=c[k].join(" ");f.currentTime=a;f.progress=a/f.duration*100}function e(a){if(f[a])f[a](f)}function g(){f.remaining&&!0!==f.remaining&&f.remaining--}function h(a){var h=f.duration,
|
||||
l=f.offset,n=f.delay,P=f.currentTime,q=f.reversed,r=d(a),r=Math.min(Math.max(r,0),h);if(f.children){var p=f.children;if(r>=f.currentTime)for(var u=0;u<p.length;u++)p[u].seek(r);else for(u=p.length;u--;)p[u].seek(r)}r>l&&r<h?(c(r),!f.began&&r>=n&&(f.began=!0,e("begin")),e("run")):(r<=l&&0!==P&&(c(0),q&&g()),r>=h&&P!==h&&(c(h),q||g()));a>=h&&(f.remaining?(t=m,"alternate"===f.direction&&(f.reversed=!f.reversed)):(f.pause(),"Promise"in window&&(Q(),R=b()),f.completed||(f.completed=!0,e("complete"))),
|
||||
k=0);e("update")}a=void 0===a?{}:a;var m,t,k=0,Q=null,R=b(),f=fa(a);f.reset=function(){var a=f.direction,b=f.loop;f.currentTime=0;f.progress=0;f.paused=!0;f.began=!1;f.completed=!1;f.reversed="reverse"===a;f.remaining="alternate"===a&&1===b?2:b;for(a=f.children.length;a--;)b=f.children[a],b.seek(b.offset),b.reset()};f.tick=function(a){m=a;t||(t=m);h((k+m-t)*n.speed)};f.seek=function(a){h(d(a))};f.pause=function(){var a=q.indexOf(f);-1<a&&q.splice(a,1);f.paused=!0};f.play=function(){f.paused&&(f.paused=
|
||||
!1,t=0,k=d(f.currentTime),q.push(f),z||ja())};f.reverse=function(){f.reversed=!f.reversed;t=0;k=d(f.currentTime)};f.restart=function(){f.pause();f.reset();f.play()};f.finished=R;f.reset();f.autoplay&&f.play();return f}var ga={update:void 0,begin:void 0,run:void 0,complete:void 0,loop:1,direction:"normal",autoplay:!0,offset:0},ha={duration:1E3,delay:0,easing:"easeOutElastic",elasticity:500,round:0},V="translateX translateY translateZ rotate rotateX rotateY rotateZ scale scaleX scaleY scaleZ skewX skewY".split(" "),
|
||||
E,g={arr:function(a){return Array.isArray(a)},obj:function(a){return-1<Object.prototype.toString.call(a).indexOf("Object")},svg:function(a){return a instanceof SVGElement},dom:function(a){return a.nodeType||g.svg(a)},str:function(a){return"string"===typeof a},fnc:function(a){return"function"===typeof a},und:function(a){return"undefined"===typeof a},hex:function(a){return/(^#[0-9A-F]{6}$)|(^#[0-9A-F]{3}$)/i.test(a)},rgb:function(a){return/^rgb/.test(a)},hsl:function(a){return/^hsl/.test(a)},col:function(a){return g.hex(a)||
|
||||
g.rgb(a)||g.hsl(a)}},y=function(){function a(a,d,c){return(((1-3*c+3*d)*a+(3*c-6*d))*a+3*d)*a}return function(b,d,c,e){if(0<=b&&1>=b&&0<=c&&1>=c){var g=new Float32Array(11);if(b!==d||c!==e)for(var h=0;11>h;++h)g[h]=a(.1*h,b,c);return function(h){if(b===d&&c===e)return h;if(0===h)return 0;if(1===h)return 1;for(var m=0,k=1;10!==k&&g[k]<=h;++k)m+=.1;--k;var k=m+(h-g[k])/(g[k+1]-g[k])*.1,l=3*(1-3*c+3*b)*k*k+2*(3*c-6*b)*k+3*b;if(.001<=l){for(m=0;4>m;++m){l=3*(1-3*c+3*b)*k*k+2*(3*c-6*b)*k+3*b;if(0===l)break;
|
||||
var n=a(k,b,c)-h,k=k-n/l}h=k}else if(0===l)h=k;else{var k=m,m=m+.1,f=0;do n=k+(m-k)/2,l=a(n,b,c)-h,0<l?m=n:k=n;while(1e-7<Math.abs(l)&&10>++f);h=n}return a(h,d,e)}}}}(),N=function(){function a(a,b){return 0===a||1===a?a:-Math.pow(2,10*(a-1))*Math.sin(2*(a-1-b/(2*Math.PI)*Math.asin(1))*Math.PI/b)}var b="Quad Cubic Quart Quint Sine Expo Circ Back Elastic".split(" "),d={In:[[.55,.085,.68,.53],[.55,.055,.675,.19],[.895,.03,.685,.22],[.755,.05,.855,.06],[.47,0,.745,.715],[.95,.05,.795,.035],[.6,.04,.98,
|
||||
.335],[.6,-.28,.735,.045],a],Out:[[.25,.46,.45,.94],[.215,.61,.355,1],[.165,.84,.44,1],[.23,1,.32,1],[.39,.575,.565,1],[.19,1,.22,1],[.075,.82,.165,1],[.175,.885,.32,1.275],function(b,c){return 1-a(1-b,c)}],InOut:[[.455,.03,.515,.955],[.645,.045,.355,1],[.77,0,.175,1],[.86,0,.07,1],[.445,.05,.55,.95],[1,0,0,1],[.785,.135,.15,.86],[.68,-.55,.265,1.55],function(b,c){return.5>b?a(2*b,c)/2:1-a(-2*b+2,c)/2}]},c={linear:y(.25,.25,.75,.75)},e={},l;for(l in d)e.type=l,d[e.type].forEach(function(a){return function(d,
|
||||
e){c["ease"+a.type+b[e]]=g.fnc(d)?d:y.apply($jscomp$this,d)}}(e)),e={type:e.type};return c}(),ia={css:function(a,b,d){return a.style[b]=d},attribute:function(a,b,d){return a.setAttribute(b,d)},object:function(a,b,d){return a[b]=d},transform:function(a,b,d,c,e){c[e]||(c[e]=[]);c[e].push(b+"("+d+")")}},q=[],z=0,ja=function(){function a(){z=requestAnimationFrame(b)}function b(b){var c=q.length;if(c){for(var d=0;d<c;)q[d]&&q[d].tick(b),d++;a()}else cancelAnimationFrame(z),z=0}return a}();n.version="2.0.2";
|
||||
n.speed=1;n.running=q;n.remove=function(a){a=M(a);for(var b=q.length;b--;)for(var d=q[b],c=d.animations,e=c.length;e--;)F(a,c[e].animatable.target)&&(c.splice(e,1),c.length||d.pause())};n.getValue=J;n.path=function(a,b){var d=g.str(a)?v(a)[0]:a,c=b||100;return function(a){return{el:d,property:a,totalLength:d.getTotalLength()*(c/100)}}};n.setDashoffset=function(a){var b=a.getTotalLength();a.setAttribute("stroke-dasharray",b);return b};n.bezier=y;n.easings=N;n.timeline=function(a){var b=n(a);b.pause();
|
||||
b.duration=0;b.add=function(a){b.children.forEach(function(a){a.began=!0;a.completed=!0});w(a).forEach(function(a){var c=b.duration,d=a.offset;a.autoplay=!1;a.offset=g.und(d)?c:K(d,c);b.seek(a.offset);a=n(a);a.duration>c&&(b.duration=a.duration);a.began=!0;b.children.push(a)});b.reset();b.seek(0);b.autoplay&&b.restart();return b};return b};n.random=function(a,b){return Math.floor(Math.random()*(b-a+1))+a};return n});
|
||||
85
source/js/third-party/canvas-ribbon.js
vendored
Normal file
85
source/js/third-party/canvas-ribbon.js
vendored
Normal file
@@ -0,0 +1,85 @@
|
||||
/**
|
||||
* Copyright (c) 2016 hustcc
|
||||
* License: MIT
|
||||
* Version: v1.0.1
|
||||
* GitHub: https://github.com/hustcc/ribbon.js
|
||||
**/
|
||||
// changed by Molunerfinn
|
||||
!(function () {
|
||||
function attr (node, attr, default_value) {
|
||||
if (default_value === true) {
|
||||
return node.getAttribute(attr) || default_value
|
||||
}
|
||||
return Number(node.getAttribute(attr)) || default_value
|
||||
}
|
||||
|
||||
// get user config
|
||||
var script = document.getElementById('ribbon'),
|
||||
config = {
|
||||
z: attr(script, 'zIndex', -1), // z-index
|
||||
a: attr(script, 'alpha', 0.6), // alpha
|
||||
s: attr(script, 'size', 90), // size
|
||||
c: attr(script, 'data-click', true) // click-to-change
|
||||
}
|
||||
|
||||
var canvas = document.createElement('canvas'),
|
||||
g2d = canvas.getContext('2d'),
|
||||
pr = window.devicePixelRatio || 1,
|
||||
width = window.innerWidth,
|
||||
height = window.innerHeight,
|
||||
f = config.s,
|
||||
q,
|
||||
t,
|
||||
m = Math,
|
||||
r = 0,
|
||||
pi = m.PI * 2,
|
||||
cos = m.cos,
|
||||
random = m.random
|
||||
canvas.width = width * pr
|
||||
canvas.height = height * pr
|
||||
g2d.scale(pr, pr)
|
||||
g2d.globalAlpha = config.a
|
||||
canvas.style.cssText =
|
||||
'opacity: ' +
|
||||
config.a +
|
||||
';position:fixed;top:0;left:0;z-index: ' +
|
||||
config.z +
|
||||
';width:100%;height:100%;pointer-events:none;'
|
||||
// create canvas
|
||||
document.getElementsByTagName('body')[0].appendChild(canvas)
|
||||
|
||||
function redraw () {
|
||||
g2d.clearRect(0, 0, width, height)
|
||||
q = [{ x: 0, y: height * 0.7 + f }, { x: 0, y: height * 0.7 - f }]
|
||||
while (q[1].x < width + f) draw(q[0], q[1])
|
||||
}
|
||||
function draw (i, j) {
|
||||
g2d.beginPath()
|
||||
g2d.moveTo(i.x, i.y)
|
||||
g2d.lineTo(j.x, j.y)
|
||||
var k = j.x + (random() * 2 - 0.25) * f,
|
||||
n = line(j.y)
|
||||
g2d.lineTo(k, n)
|
||||
g2d.closePath()
|
||||
r -= pi / -50
|
||||
g2d.fillStyle =
|
||||
'#' +
|
||||
(
|
||||
((cos(r) * 127 + 128) << 16) |
|
||||
((cos(r + pi / 3) * 127 + 128) << 8) |
|
||||
(cos(r + (pi / 3) * 2) * 127 + 128)
|
||||
).toString(16)
|
||||
g2d.fill()
|
||||
q[0] = q[1]
|
||||
q[1] = { x: k, y: n }
|
||||
}
|
||||
function line (p) {
|
||||
t = p + (random() * 2 - 1.1) * f
|
||||
return t > height || t < 0 ? line(p) : t
|
||||
}
|
||||
if (config.c !== 'false') {
|
||||
document.onclick = redraw
|
||||
document.ontouchstart = redraw
|
||||
}
|
||||
redraw()
|
||||
})()
|
||||
12
source/js/third-party/jquery.fancybox.min.js
vendored
Normal file
12
source/js/third-party/jquery.fancybox.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
4
source/js/third-party/jquery.min.js
vendored
Normal file
4
source/js/third-party/jquery.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
324
source/js/third-party/piao.js
vendored
Normal file
324
source/js/third-party/piao.js
vendored
Normal file
@@ -0,0 +1,324 @@
|
||||
(function(name, factory) {
|
||||
if (typeof window === "object") {
|
||||
window[name] = factory()
|
||||
}
|
||||
})("Ribbons", function() {
|
||||
var _w = window,
|
||||
_b = document.body,
|
||||
_d = document.documentElement;
|
||||
var random = function() {
|
||||
if (arguments.length === 1) {
|
||||
if (Array.isArray(arguments[0])) {
|
||||
var index = Math.round(random(0, arguments[0].length - 1));
|
||||
return arguments[0][index]
|
||||
}
|
||||
return random(0, arguments[0])
|
||||
} else if (arguments.length === 2) {
|
||||
return Math.random() * (arguments[1] - arguments[0]) + arguments[0]
|
||||
}
|
||||
return 0
|
||||
};
|
||||
var screenInfo = function(e) {
|
||||
var width = Math.max(0, _w.innerWidth || _d.clientWidth || _b.clientWidth || 0),
|
||||
height = Math.max(0, _w.innerHeight || _d.clientHeight || _b.clientHeight || 0),
|
||||
scrollx = Math.max(0, _w.pageXOffset || _d.scrollLeft || _b.scrollLeft || 0) - (_d.clientLeft || 0),
|
||||
scrolly = Math.max(0, _w.pageYOffset || _d.scrollTop || _b.scrollTop || 0) - (_d.clientTop || 0);
|
||||
return {
|
||||
width: width,
|
||||
height: height,
|
||||
ratio: width / height,
|
||||
centerx: width / 2,
|
||||
centery: height / 2,
|
||||
scrollx: scrollx,
|
||||
scrolly: scrolly
|
||||
}
|
||||
};
|
||||
var mouseInfo = function(e) {
|
||||
var screen = screenInfo(e),
|
||||
mousex = e ? Math.max(0, e.pageX || e.clientX || 0) : 0,
|
||||
mousey = e ? Math.max(0, e.pageY || e.clientY || 0) : 0;
|
||||
return {
|
||||
mousex: mousex,
|
||||
mousey: mousey,
|
||||
centerx: mousex - screen.width / 2,
|
||||
centery: mousey - screen.height / 2
|
||||
}
|
||||
};
|
||||
var Point = function(x, y) {
|
||||
this.x = 0;
|
||||
this.y = 0;
|
||||
this.set(x, y)
|
||||
};
|
||||
Point.prototype = {
|
||||
constructor: Point,
|
||||
set: function(x, y) {
|
||||
this.x = x || 0;
|
||||
this.y = y || 0
|
||||
},
|
||||
copy: function(point) {
|
||||
this.x = point.x || 0;
|
||||
this.y = point.y || 0;
|
||||
return this
|
||||
},
|
||||
multiply: function(x, y) {
|
||||
this.x *= x || 1;
|
||||
this.y *= y || 1;
|
||||
return this
|
||||
},
|
||||
divide: function(x, y) {
|
||||
this.x /= x || 1;
|
||||
this.y /= y || 1;
|
||||
return this
|
||||
},
|
||||
add: function(x, y) {
|
||||
this.x += x || 0;
|
||||
this.y += y || 0;
|
||||
return this
|
||||
},
|
||||
subtract: function(x, y) {
|
||||
this.x -= x || 0;
|
||||
this.y -= y || 0;
|
||||
return this
|
||||
},
|
||||
clampX: function(min, max) {
|
||||
this.x = Math.max(min, Math.min(this.x, max));
|
||||
return this
|
||||
},
|
||||
clampY: function(min, max) {
|
||||
this.y = Math.max(min, Math.min(this.y, max));
|
||||
return this
|
||||
},
|
||||
flipX: function() {
|
||||
this.x *= -1;
|
||||
return this
|
||||
},
|
||||
flipY: function() {
|
||||
this.y *= -1;
|
||||
return this
|
||||
}
|
||||
};
|
||||
var Factory = function(options) {
|
||||
this._canvas = null;
|
||||
this._context = null;
|
||||
this._sto = null;
|
||||
this._width = 0;
|
||||
this._height = 0;
|
||||
this._scroll = 0;
|
||||
this._ribbons = [];
|
||||
this._options = {
|
||||
colorSaturation: "80%",
|
||||
colorBrightness: "60%",
|
||||
colorAlpha: 0.65,
|
||||
colorCycleSpeed: 6,
|
||||
verticalPosition: "center",
|
||||
horizontalSpeed: 150,
|
||||
ribbonCount: 5,
|
||||
strokeSize: 5,
|
||||
parallaxAmount: -0.5,
|
||||
animateSections: true
|
||||
};
|
||||
this._onDraw = this._onDraw.bind(this);
|
||||
this._onResize = this._onResize.bind(this);
|
||||
this._onScroll = this._onScroll.bind(this);
|
||||
this.setOptions(options);
|
||||
this.init()
|
||||
};
|
||||
Factory.prototype = {
|
||||
constructor: Factory,
|
||||
setOptions: function(options) {
|
||||
if (typeof options === "object") {
|
||||
for (var key in options) {
|
||||
if (options.hasOwnProperty(key)) {
|
||||
this._options[key] = options[key]
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
init: function() {
|
||||
try {
|
||||
this._canvas = document.createElement("canvas");
|
||||
this._canvas.style["display"] = "block";
|
||||
this._canvas.style["position"] = "fixed";
|
||||
this._canvas.style["margin"] = "0";
|
||||
this._canvas.style["padding"] = "0";
|
||||
this._canvas.style["border"] = "0";
|
||||
this._canvas.style["outline"] = "0";
|
||||
this._canvas.style["left"] = "0";
|
||||
this._canvas.style["top"] = "0";
|
||||
this._canvas.style["width"] = "100%";
|
||||
this._canvas.style["height"] = "100%";
|
||||
this._canvas.style["z-index"] = "-1";
|
||||
this._onResize();
|
||||
this._context = this._canvas.getContext("2d");
|
||||
this._context.clearRect(0, 0, this._width, this._height);
|
||||
this._context.globalAlpha = this._options.colorAlpha;
|
||||
window.addEventListener("resize", this._onResize);
|
||||
window.addEventListener("scroll", this._onScroll);
|
||||
document.body.appendChild(this._canvas)
|
||||
} catch (e) {
|
||||
console.warn("Canvas Context Error: " + e.toString());
|
||||
return
|
||||
}
|
||||
this._onDraw()
|
||||
},
|
||||
addRibbon: function() {
|
||||
var dir = Math.round(random(1, 9)) > 5 ? "right" : "left",
|
||||
stop = 1000,
|
||||
hide = 200,
|
||||
min = 0 - hide,
|
||||
max = this._width + hide,
|
||||
movex = 0,
|
||||
movey = 0,
|
||||
startx = dir === "right" ? min : max,
|
||||
starty = Math.round(random(0, this._height));
|
||||
if (/^(top|min)$/i.test(this._options.verticalPosition)) {
|
||||
starty = 0 + hide
|
||||
} else if (/^(middle|center)$/i.test(this._options.verticalPosition)) {
|
||||
starty = this._height / 2
|
||||
} else if (/^(bottom|max)$/i.test(this._options.verticalPosition)) {
|
||||
starty = this._height - hide
|
||||
}
|
||||
var ribbon = [],
|
||||
point1 = new Point(startx, starty),
|
||||
point2 = new Point(startx, starty),
|
||||
point3 = null,
|
||||
color = Math.round(random(0, 360)),
|
||||
delay = 0;
|
||||
while (true) {
|
||||
if (stop <= 0) break;
|
||||
stop--;
|
||||
movex = Math.round((Math.random() * 1 - 0.2) * this._options.horizontalSpeed);
|
||||
movey = Math.round((Math.random() * 1 - 0.5) * (this._height * 0.25));
|
||||
point3 = new Point();
|
||||
point3.copy(point2);
|
||||
if (dir === "right") {
|
||||
point3.add(movex, movey);
|
||||
if (point2.x >= max) break
|
||||
} else if (dir === "left") {
|
||||
point3.subtract(movex, movey);
|
||||
if (point2.x <= min) break
|
||||
}
|
||||
ribbon.push({
|
||||
point1: new Point(point1.x, point1.y),
|
||||
point2: new Point(point2.x, point2.y),
|
||||
point3: point3,
|
||||
color: color,
|
||||
delay: delay,
|
||||
dir: dir,
|
||||
alpha: 0,
|
||||
phase: 0
|
||||
});
|
||||
point1.copy(point2);
|
||||
point2.copy(point3);
|
||||
delay += 4;
|
||||
color += this._options.colorCycleSpeed
|
||||
}
|
||||
this._ribbons.push(ribbon)
|
||||
},
|
||||
_drawRibbonSection: function(section) {
|
||||
if (section) {
|
||||
if (section.phase >= 1 && section.alpha <= 0) {
|
||||
return true
|
||||
}
|
||||
if (section.delay <= 0) {
|
||||
section.phase += 0.02;
|
||||
section.alpha = Math.sin(section.phase) * 1;
|
||||
section.alpha = section.alpha <= 0 ? 0 : section.alpha;
|
||||
section.alpha = section.alpha >= 1 ? 1 : section.alpha;
|
||||
if (this._options.animateSections) {
|
||||
var mod = Math.sin(1 + section.phase * Math.PI / 2) * 0.1;
|
||||
if (section.dir === "right") {
|
||||
section.point1.add(mod, 0);
|
||||
section.point2.add(mod, 0);
|
||||
section.point3.add(mod, 0)
|
||||
} else {
|
||||
section.point1.subtract(mod, 0);
|
||||
section.point2.subtract(mod, 0);
|
||||
section.point3.subtract(mod, 0)
|
||||
}
|
||||
section.point1.add(0, mod);
|
||||
section.point2.add(0, mod);
|
||||
section.point3.add(0, mod)
|
||||
}
|
||||
} else {
|
||||
section.delay -= 0.5
|
||||
}
|
||||
var s = this._options.colorSaturation,
|
||||
l = this._options.colorBrightness,
|
||||
c = "hsla(" + section.color + ", " + s + ", " + l + ", " + section.alpha + " )";
|
||||
this._context.save();
|
||||
if (this._options.parallaxAmount !== 0) {
|
||||
this._context.translate(0, this._scroll * this._options.parallaxAmount)
|
||||
}
|
||||
this._context.beginPath();
|
||||
this._context.moveTo(section.point1.x, section.point1.y);
|
||||
this._context.lineTo(section.point2.x, section.point2.y);
|
||||
this._context.lineTo(section.point3.x, section.point3.y);
|
||||
this._context.fillStyle = c;
|
||||
this._context.fill();
|
||||
if (this._options.strokeSize > 0) {
|
||||
this._context.lineWidth = this._options.strokeSize;
|
||||
this._context.strokeStyle = c;
|
||||
this._context.lineCap = "round";
|
||||
this._context.stroke()
|
||||
}
|
||||
this._context.restore()
|
||||
}
|
||||
return false
|
||||
},
|
||||
_onDraw: function() {
|
||||
for (var i = 0, t = this._ribbons.length; i < t; ++i) {
|
||||
if (!this._ribbons[i]) {
|
||||
this._ribbons.splice(i, 1)
|
||||
}
|
||||
}
|
||||
this._context.clearRect(0, 0, this._width, this._height);
|
||||
for (var a = 0; a < this._ribbons.length; ++a) {
|
||||
var ribbon = this._ribbons[a],
|
||||
numSections = ribbon.length,
|
||||
numDone = 0;
|
||||
for (var b = 0; b < numSections; ++b) {
|
||||
if (this._drawRibbonSection(ribbon[b])) {
|
||||
numDone++
|
||||
}
|
||||
}
|
||||
if (numDone >= numSections) {
|
||||
this._ribbons[a] = null
|
||||
}
|
||||
}
|
||||
if (this._ribbons.length < this._options.ribbonCount) {
|
||||
this.addRibbon()
|
||||
}
|
||||
requestAnimationFrame(this._onDraw)
|
||||
},
|
||||
_onResize: function(e) {
|
||||
var screen = screenInfo(e);
|
||||
this._width = screen.width;
|
||||
this._height = screen.height;
|
||||
if (this._canvas) {
|
||||
this._canvas.width = this._width;
|
||||
this._canvas.height = this._height;
|
||||
if (this._context) {
|
||||
this._context.globalAlpha = this._options.colorAlpha
|
||||
}
|
||||
}
|
||||
},
|
||||
_onScroll: function(e) {
|
||||
var screen = screenInfo(e);
|
||||
this._scroll = screen.scrolly
|
||||
}
|
||||
};
|
||||
return Factory
|
||||
});
|
||||
new Ribbons({
|
||||
colorSaturation: "60%",
|
||||
colorBrightness: "50%",
|
||||
colorAlpha: 0.5,
|
||||
colorCycleSpeed: 5,
|
||||
verticalPosition: "random",
|
||||
horizontalSpeed: 200,
|
||||
ribbonCount: 3,
|
||||
strokeSize: 0,
|
||||
parallaxAmount: -0.2,
|
||||
animateSections: true
|
||||
});
|
||||
203
source/js/tw_cn.js
Normal file
203
source/js/tw_cn.js
Normal file
File diff suppressed because one or more lines are too long
54
source/js/utils.js
Normal file
54
source/js/utils.js
Normal file
@@ -0,0 +1,54 @@
|
||||
function debounce(func, wait, immediate) {
|
||||
var timeout
|
||||
return function () {
|
||||
var context = this
|
||||
var args = arguments
|
||||
var later = function () {
|
||||
timeout = null
|
||||
if (!immediate) func.apply(context, args)
|
||||
}
|
||||
var callNow = immediate && !timeout
|
||||
clearTimeout(timeout)
|
||||
timeout = setTimeout(later, wait)
|
||||
if (callNow) func.apply(context, args)
|
||||
}
|
||||
};
|
||||
|
||||
function throttle(func, wait, mustRun) {
|
||||
var timeout
|
||||
var startTime = new Date()
|
||||
|
||||
return function () {
|
||||
var context = this
|
||||
var args = arguments
|
||||
var curTime = new Date()
|
||||
|
||||
clearTimeout(timeout)
|
||||
if (curTime - startTime >= mustRun) {
|
||||
func.apply(context, args)
|
||||
startTime = curTime
|
||||
} else {
|
||||
timeout = setTimeout(func, wait)
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
function isMobile() {
|
||||
var check = false;
|
||||
(function (a) { if (/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino/i.test(a) || /1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i.test(a.substr(0, 4))) check = true })(navigator.userAgent || navigator.vendor || window.opera)
|
||||
return check
|
||||
};
|
||||
|
||||
function scrollTo(name) {
|
||||
var scroll_offset = $(name).offset();
|
||||
$("body,html").animate({
|
||||
scrollTop: scroll_offset.top
|
||||
})
|
||||
};
|
||||
|
||||
window.debounce = debounce
|
||||
|
||||
window.throttle = throttle
|
||||
|
||||
window.isMobile = isMobile
|
||||
|
||||
Reference in New Issue
Block a user