mirror of
https://github.com/jerryc127/hexo-theme-butterfly.git
synced 2026-04-16 19:40:55 +08:00
1. 更改手機頁面的menu和toc的顯示方式和顯示特效（ipad也能看TOC)
1. 更改手機頁面的menu和toc的顯示方式和顯示特效（ipad也能看TOC) 3. 可設置複製時，内容自動加上版權信息 4. 可修改tag的top_img 5. 可修改category的top_img 6. 可修改valine的背景 7. archives頁UI優化 8. ICP增加icon #37 9. 可設置主頁top_img的高度 10. 可設置主頁site-info的位置 11. category頁和tag頁的UI可以設置與主頁UI一樣 #31 12. 主頁subtitle可設置多個句子（不再限制2個） #37 13. 設置menu時，頭尾添加空格不受影響 14. 調整post頁的佈局 15. 书签添加icon 16. 公告icon效果 17. 首頁歸檔模塊，可設置數量限制，會顯示'查看更多'按鈕 18. 右下角按鈕調整。 19. 修复文章cover隨機图片生成，同一篇文章，不同地方的cover顯示不一样的bug 20. 修復gitalk語言設置無效的bug #35 21. 修復post頁面，當沒有設置word count時，閲讀量前有'|" 22. 修复sub-menu在safari的显示问题 23. 修复tags页评论居中问题 24. 修复header a hover 白色问题 25. 修復夜間模式下footer的顔色bug 26. 修復英文語言下，書簽英文顯示不完整的問題
This commit is contained in:
Jerry
@@ -5,17 +5,12 @@
|
||||
-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
|
||||
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
|
||||
@@ -28,10 +23,8 @@
|
||||
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
|
||||
@@ -54,10 +47,9 @@
|
||||
.headline
|
||||
display: block
|
||||
font-size: 0.7rem
|
||||
// letter-spacing: 1px
|
||||
margin-bottom: -21px
|
||||
text-transform: uppercase
|
||||
color:#4c4948
|
||||
color:$font-black
|
||||
|
||||
#aside-social-icons
|
||||
margin: 0.5rem auto -0.7rem
|
||||
@@ -66,8 +58,7 @@
|
||||
|
||||
.social-icon
|
||||
margin: 0 0.5rem
|
||||
color: #4c4948
|
||||
/* text-shadow: 0.1rem 0.1rem 0.2rem rgba(0,0,0,0.15) */
|
||||
color: $font-black
|
||||
font-size: 1rem
|
||||
cursor: pointer
|
||||
|
||||
@@ -75,16 +66,10 @@
|
||||
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
|
||||
#bookmark-it
|
||||
margin-top: .2rem
|
||||
padding: 0 1rem
|
||||
height: 1.6rem
|
||||
background: $light-blue
|
||||
color: #fff
|
||||
@@ -94,6 +79,9 @@
|
||||
text-transform: uppercase
|
||||
z-index: 1
|
||||
|
||||
span
|
||||
padding-left: 10px
|
||||
|
||||
.toggle_change--primary,.bookmark--primary
|
||||
color: $ruby
|
||||
|
||||
@@ -101,7 +89,7 @@
|
||||
transition-property: color
|
||||
transition-duration: 1s
|
||||
|
||||
&:before {
|
||||
&:before
|
||||
content: ""
|
||||
position: absolute
|
||||
top: 0
|
||||
@@ -115,18 +103,13 @@
|
||||
transition-duration: 0.5s
|
||||
transition-timing-function: ease-out
|
||||
z-index: -1
|
||||
}
|
||||
|
||||
&:hover {
|
||||
|
||||
&:hover
|
||||
color: white
|
||||
|
||||
&:before {
|
||||
&:before
|
||||
transform: scaleX(1)
|
||||
transition-timing-function: cubic-bezier(0.45, 1.64, 0.47, 0.66)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
.card-content
|
||||
padding: 1rem 1.2rem
|
||||
@@ -140,7 +123,6 @@
|
||||
flex-basis: auto
|
||||
justify-content: center
|
||||
|
||||
|
||||
.item_headline
|
||||
font-size: 0.8rem
|
||||
|
||||
@@ -170,39 +152,41 @@
|
||||
&::after
|
||||
width: 100%
|
||||
|
||||
|
||||
|
||||
.aside_recent_item
|
||||
margin: 10px 0 -15px 0
|
||||
|
||||
.aside_recent_post
|
||||
a
|
||||
text-decoration: none
|
||||
color: #4c4948
|
||||
color: $font-black
|
||||
|
||||
.aside_recent_post
|
||||
margin-bottom: 10px
|
||||
width: 100%
|
||||
|
||||
.aside_post_cover
|
||||
height: 70px
|
||||
width: 70px
|
||||
height: 66px
|
||||
width: 66px
|
||||
float: left
|
||||
overflow: hidden
|
||||
|
||||
.aside_post_bg
|
||||
object-fit: cover
|
||||
width: 100%
|
||||
height: 100%
|
||||
max-width: 100%
|
||||
padding: 0
|
||||
transition: all .6s
|
||||
|
||||
&:hover
|
||||
box-shadow: none
|
||||
transform: scale(1.1)
|
||||
|
||||
#aside_title
|
||||
padding-top: 4px
|
||||
|
||||
#aside_title
|
||||
.aside_post_meta
|
||||
font-size: 0.6rem
|
||||
padding-left: 5px
|
||||
padding-left: 10px
|
||||
color: #99a9bf
|
||||
|
||||
.aside_post_title
|
||||
line-height: 1rem
|
||||
@@ -210,14 +194,12 @@
|
||||
-webkit-line-clamp: 2
|
||||
-webkit-box-orient: vertical
|
||||
overflow: hidden
|
||||
height: 41px
|
||||
padding-left: 5px
|
||||
height: 40px
|
||||
padding-left: 10px
|
||||
|
||||
&:hover
|
||||
color: $light-blue !important
|
||||
|
||||
|
||||
|
||||
.aside_category_item,.archive-list
|
||||
list-style: none
|
||||
margin-bottom: -3px
|
||||
@@ -232,14 +214,14 @@
|
||||
|
||||
.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
|
||||
color: $font-black
|
||||
padding: 0.2rem 1rem
|
||||
|
||||
.aside_category_list_name,.archive-list-link
|
||||
white-space: nowrap
|
||||
@@ -250,9 +232,6 @@
|
||||
.aside_category_list_link,.archive-list-item
|
||||
display: flex
|
||||
|
||||
|
||||
|
||||
|
||||
.aside_category_list_length,.archive-list-count
|
||||
float: right
|
||||
|
||||
@@ -280,16 +259,60 @@
|
||||
float: right
|
||||
display: inline-block
|
||||
|
||||
// bookmark 樣式
|
||||
.fc-container .fancybox-bg
|
||||
background: #eee
|
||||
|
||||
@keyframes announ_animation{
|
||||
0%,to{
|
||||
color: #4c4948
|
||||
}
|
||||
50%{
|
||||
color: #FF0000
|
||||
}
|
||||
}
|
||||
.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
|
||||
user-select: none
|
||||
|
||||
@media screen and (max-width: 900px)
|
||||
.layout_page
|
||||
|
||||
@@ -16,7 +16,6 @@
|
||||
li
|
||||
position: relative
|
||||
margin: 0.3rem 0
|
||||
// padding-left: 0.3rem
|
||||
padding: 0.1rem 0.5rem 0.1rem 1.5rem !important
|
||||
|
||||
&:hover
|
||||
|
||||
@@ -1,2 +1,65 @@
|
||||
#disqus_thread
|
||||
margin-top: 1rem
|
||||
margin-top: 1rem
|
||||
|
||||
.comment_headling
|
||||
font-size: 20px
|
||||
font-weight: 700
|
||||
margin-bottom: 10px
|
||||
|
||||
// valine
|
||||
#vcomment
|
||||
font-size: inherit
|
||||
|
||||
input
|
||||
font-size: 0.65rem
|
||||
|
||||
button
|
||||
font-size: .7rem
|
||||
padding: .3rem 1rem
|
||||
background-color: $light-blue
|
||||
color: #fff
|
||||
border-color: #fff
|
||||
|
||||
&:hover
|
||||
background-color: darken($light-blue, 40)
|
||||
|
||||
textarea
|
||||
font-size: 0.7rem
|
||||
if hexo-config("valine.bg")
|
||||
background: url(convert(hexo-config("valine.bg"))) 100% 100% no-repeat
|
||||
|
||||
.info
|
||||
display: none
|
||||
|
||||
.vimg
|
||||
border: 0
|
||||
|
||||
&:hover
|
||||
transform: rotate(540deg)
|
||||
.vcount
|
||||
font-size: 0.775rem
|
||||
|
||||
.vnum
|
||||
font-size: 1.1rem
|
||||
|
||||
.vsys
|
||||
font-size: 80%
|
||||
|
||||
.vtime
|
||||
font-size: .65rem
|
||||
|
||||
.vcontent
|
||||
font-size: 100%
|
||||
|
||||
.vat
|
||||
font-size: .7125rem
|
||||
color: $cyan
|
||||
border: 1px solid $cyan
|
||||
padding: 0 .8rem
|
||||
border-radius: 5px
|
||||
|
||||
&:hover
|
||||
background-color: alpha($cyan,0.5)
|
||||
|
||||
code, pre
|
||||
font-size: 98%
|
||||
|
||||
@@ -24,13 +24,10 @@
|
||||
text-overflow: ellipsis
|
||||
overflow: hidden
|
||||
border-radius: 8px
|
||||
-webkit-transform: perspective(1px) translateZ(0)
|
||||
transform: perspective(1px) translateZ(0)
|
||||
box-shadow: 0 0 1px rgba(0, 0, 0, 0)
|
||||
position: relative
|
||||
-webkit-transition-property: color
|
||||
transition-property: color
|
||||
-webkit-transition-duration: 0.3s
|
||||
transition-duration: 0.3s
|
||||
|
||||
img
|
||||
@@ -44,9 +41,6 @@
|
||||
&:hover
|
||||
img
|
||||
filter: unqoute("progid:DXImageTransform.Microsoft.BasicImage(rotation=3)")
|
||||
-moz-transform: rotate(540deg)
|
||||
-o-transform: rotate(540deg)
|
||||
-webkit-transform: rotate(540deg)
|
||||
transform: rotate(540deg)
|
||||
|
||||
&:before
|
||||
@@ -58,13 +52,9 @@
|
||||
right: 0
|
||||
bottom: 0
|
||||
background: $light-blue !important
|
||||
-webkit-transform: scale(0)
|
||||
transform: scale(0)
|
||||
-webkit-transition-property: transform
|
||||
transition-property: transform
|
||||
-webkit-transition-duration: 0.3s
|
||||
transition-duration: 0.3s
|
||||
-webkit-transition-timing-function: ease-out
|
||||
transition-timing-function: ease-out
|
||||
|
||||
.md-links-item:hover,
|
||||
@@ -94,7 +84,7 @@
|
||||
.post-cards
|
||||
margin-top: 5px
|
||||
min-height: 100px
|
||||
padding: 15px
|
||||
padding: 0 15px
|
||||
border-radius: 15px
|
||||
|
||||
.comment-word
|
||||
@@ -121,8 +111,6 @@
|
||||
li
|
||||
width: calc(100%/2 - 14px)
|
||||
|
||||
|
||||
|
||||
@media screen and (max-width:600px)
|
||||
.flink
|
||||
.md-links
|
||||
|
||||
@@ -37,3 +37,7 @@ footer
|
||||
.footer-separator
|
||||
margin: 0 0.2rem
|
||||
|
||||
.icp-icon
|
||||
padding: 0 4px
|
||||
vertical-align: text-bottom
|
||||
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
margin-bottom: 1rem
|
||||
|
||||
&.full_page
|
||||
height: 100vh
|
||||
height: $index_top_img_height
|
||||
|
||||
.nav_bg
|
||||
width: 100%
|
||||
@@ -16,7 +16,6 @@
|
||||
&.not_index_bg
|
||||
height: 20rem
|
||||
|
||||
|
||||
#site-social-icons
|
||||
margin: 0 auto
|
||||
width: 15rem
|
||||
@@ -36,7 +35,7 @@
|
||||
#site-info
|
||||
position: absolute
|
||||
width: 100%
|
||||
top: 43%
|
||||
top: $index_site_info_top
|
||||
|
||||
#site-title,
|
||||
#site-sub-title
|
||||
@@ -68,8 +67,10 @@
|
||||
|
||||
.scroll-down-effects
|
||||
position: absolute
|
||||
color: #fff
|
||||
color: $white
|
||||
|
||||
#header
|
||||
position: relative
|
||||
|
||||
#page-header
|
||||
position: absolute
|
||||
@@ -79,110 +80,17 @@
|
||||
width: 100%
|
||||
border: none
|
||||
font-size: 18px
|
||||
transition: all 0.2s ease-in-out
|
||||
transition: all .3s
|
||||
|
||||
.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)
|
||||
|
||||
.menu_mask
|
||||
position: fixed
|
||||
top: 0
|
||||
bottom: 0
|
||||
width: 100%
|
||||
height: 110vh
|
||||
left: 0
|
||||
right: 0
|
||||
background: alpha($black,0.7)
|
||||
display: none
|
||||
|
||||
.menus
|
||||
.mobile_author_icon
|
||||
display: none
|
||||
padding: 1.3rem 1.5rem 0
|
||||
text-align: center
|
||||
|
||||
|
||||
img
|
||||
height: 120px
|
||||
width: 120px
|
||||
display: inline-block
|
||||
vertical-align: top
|
||||
border-radius: 70px
|
||||
transition: all .3s
|
||||
|
||||
.mobile_post_data
|
||||
display: flex
|
||||
justify-content: center
|
||||
padding: .6rem .5rem 0
|
||||
display: none
|
||||
|
||||
.mobile_data_item
|
||||
flex: 1
|
||||
|
||||
.mobile_data_link
|
||||
a
|
||||
text-decoration: none
|
||||
|
||||
.length_num
|
||||
font-size: .9rem
|
||||
color: #000
|
||||
|
||||
.headline
|
||||
display: block
|
||||
font-size: 0.7rem
|
||||
// letter-spacing: .5px
|
||||
text-transform: uppercase
|
||||
color:#4c4948
|
||||
|
||||
.menus-expand
|
||||
position: absolute
|
||||
width: 30px !important
|
||||
height: 30px
|
||||
right: 0
|
||||
padding: 6px
|
||||
display: none
|
||||
transform: rotate(0deg)
|
||||
transition: all .3s
|
||||
|
||||
&.menus-closed
|
||||
transform: rotate(180deg) !important
|
||||
transition: all .3s
|
||||
|
||||
hr
|
||||
margin: 1rem auto
|
||||
display: none
|
||||
|
||||
a
|
||||
color: $light-grey
|
||||
text-decoration: none
|
||||
@@ -190,27 +98,6 @@
|
||||
&:hover
|
||||
color: $white
|
||||
|
||||
.site-page
|
||||
position: relative
|
||||
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
|
||||
@@ -225,50 +112,49 @@
|
||||
opacity: 0
|
||||
|
||||
a,
|
||||
#site-name
|
||||
#site-name,
|
||||
.toggle-menu
|
||||
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
|
||||
&:hover
|
||||
color: $light-blue
|
||||
|
||||
&.visible
|
||||
transform: translate3d(0, 100%, 0)
|
||||
transition: all .3s
|
||||
|
||||
.menus_item_child
|
||||
background-color: $white !important
|
||||
|
||||
&:before
|
||||
border-color: transparent transparent $white !important
|
||||
|
||||
#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
|
||||
.menus_item
|
||||
display: inline-block
|
||||
padding: 0 0 0 0.7rem
|
||||
|
||||
#site-sub-title
|
||||
font-size: 1.2rem
|
||||
|
||||
#page-header
|
||||
.menus_item
|
||||
display: inline-block
|
||||
padding: 0 0.5rem
|
||||
|
||||
&:hover,&:focus
|
||||
.menus_item_child
|
||||
display: block
|
||||
&:hover,&:focus
|
||||
.menus_item_child
|
||||
display: block
|
||||
|
||||
.menus-expand
|
||||
transform: rotate(180deg) !important
|
||||
|
||||
.menus-expand
|
||||
padding: 4px
|
||||
transform: rotate(0deg)
|
||||
transition: all .3s
|
||||
|
||||
.menus_item_child
|
||||
position: absolute
|
||||
background-color: alpha($white, 0.8)
|
||||
padding: 8px 10px
|
||||
width: fit-content
|
||||
border-radius: 5px
|
||||
box-shadow: 0 5px 20px -4px rgba(0,0,0,.5)
|
||||
display: none
|
||||
@@ -285,95 +171,63 @@
|
||||
border-style: solid
|
||||
border-color: transparent transparent alpha($white, 0.8)
|
||||
|
||||
.menus_item_child li
|
||||
list-style: none
|
||||
text-align: center
|
||||
li
|
||||
list-style: none
|
||||
text-align: center
|
||||
|
||||
a
|
||||
color: #3b3a3a;
|
||||
text-shadow: none;
|
||||
a
|
||||
color: #3b3a3a
|
||||
text-shadow: none
|
||||
|
||||
&.fixed.visible
|
||||
.menus_item_child
|
||||
background-color: #ffffff
|
||||
.site-page
|
||||
position: relative
|
||||
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%
|
||||
|
||||
|
||||
@media screen and (min-width: $sm)
|
||||
#site-title
|
||||
font-size: 2rem
|
||||
|
||||
#site-sub-title
|
||||
font-size: 1.2rem
|
||||
|
||||
&:before
|
||||
border-color: transparent transparent #ffffff
|
||||
|
||||
@media screen and (max-width: $sm)
|
||||
#page-header
|
||||
padding: 10px 0.8rem
|
||||
|
||||
.menus
|
||||
display: none
|
||||
|
||||
.toggle-menu
|
||||
display: block
|
||||
|
||||
.menus
|
||||
position: fixed
|
||||
top: 0
|
||||
right: -250px
|
||||
width: 250px
|
||||
height 101vh
|
||||
background: $white
|
||||
cursor: pointer
|
||||
box-shadow: 0 0 4px rgba(0, 0, 0, 0.27)
|
||||
z-index: 1
|
||||
overflow-y: scroll
|
||||
display: none
|
||||
|
||||
.mobile_post_data
|
||||
display: flex
|
||||
|
||||
.menus_items
|
||||
a
|
||||
display: block !important
|
||||
opacity: 1 !important
|
||||
margin: 0
|
||||
padding: .3rem 1.5rem
|
||||
color: $font-black
|
||||
text-shadow: none
|
||||
font-size: 0.8rem
|
||||
z-index: 0
|
||||
text-overflow: ellipsis
|
||||
overflow: hidden
|
||||
white-space: nowrap
|
||||
|
||||
i
|
||||
width: 30%
|
||||
text-align: left
|
||||
|
||||
span
|
||||
width 70%
|
||||
|
||||
&:hover
|
||||
color: $light-blue
|
||||
|
||||
.menus-expand
|
||||
display: inline-block
|
||||
|
||||
.menus_item_child
|
||||
list-style: none
|
||||
margin: 0
|
||||
|
||||
.mobile_author_icon
|
||||
display: block
|
||||
|
||||
.menus_items
|
||||
padding: 0 .5rem
|
||||
margin-bottom: 5rem
|
||||
|
||||
hr
|
||||
display: block
|
||||
|
||||
.search
|
||||
right: 0.5rem
|
||||
|
||||
span
|
||||
display none
|
||||
|
||||
&.fixed.open-sidebar
|
||||
.search
|
||||
display: inline-block
|
||||
opacity: 1
|
||||
|
||||
|
||||
|
||||
|
||||
@media screen and (max-width: $bg)
|
||||
#page-header
|
||||
&.fixed
|
||||
&.open-sidebar
|
||||
.site-page
|
||||
display: inline-block
|
||||
opacity: 1
|
||||
163
source/css/_layout/mobile-sidebar.styl
Normal file
163
source/css/_layout/mobile-sidebar.styl
Normal file
@@ -0,0 +1,163 @@
|
||||
#mobile-sidebar
|
||||
#menu_mask
|
||||
position: fixed
|
||||
top: 0
|
||||
bottom: 0
|
||||
width: 100%
|
||||
height: 110vh
|
||||
left: 0
|
||||
right: 0
|
||||
background: alpha($black,0.7)
|
||||
z-index: 102
|
||||
display: none
|
||||
|
||||
#mobile-sidebar-menus,#mobile-sidebar-toc
|
||||
position: fixed
|
||||
top: 0
|
||||
right: -254px
|
||||
width: 250px
|
||||
height 101vh
|
||||
background: $white
|
||||
cursor: pointer
|
||||
box-shadow: 0 0 4px alpha($dark-black,0.27)
|
||||
z-index: 103
|
||||
overflow-y: scroll
|
||||
display: block
|
||||
transition: all .3s
|
||||
display: none
|
||||
|
||||
#mobile-sidebar-menus
|
||||
.mobile_author_icon
|
||||
padding: 1.3rem 1.5rem 0
|
||||
text-align: center
|
||||
|
||||
img
|
||||
height: 120px
|
||||
width: 120px
|
||||
display: inline-block
|
||||
vertical-align: top
|
||||
border-radius: 70px
|
||||
transition: all .3s
|
||||
|
||||
.mobile_post_data
|
||||
display: flex
|
||||
justify-content: center
|
||||
padding: .6rem .5rem 0
|
||||
|
||||
.mobile_data_item
|
||||
flex: 1
|
||||
|
||||
.mobile_data_link
|
||||
a
|
||||
text-decoration: none
|
||||
|
||||
.length_num
|
||||
font-size: .9rem
|
||||
color: $dark-black
|
||||
|
||||
.headline
|
||||
display: block
|
||||
font-size: 0.7rem
|
||||
text-transform: uppercase
|
||||
color:$font-black
|
||||
|
||||
hr
|
||||
margin: 1rem auto
|
||||
|
||||
.menus_items
|
||||
padding: 0 .5rem
|
||||
margin-bottom: 5rem
|
||||
|
||||
a
|
||||
display: block !important
|
||||
opacity: 1 !important
|
||||
margin: 0
|
||||
padding: .3rem 1.5rem
|
||||
color: $font-black
|
||||
text-shadow: none
|
||||
font-size: 0.8rem
|
||||
z-index: 0
|
||||
text-overflow: ellipsis
|
||||
overflow: hidden
|
||||
white-space: nowrap
|
||||
|
||||
i
|
||||
width: 30%
|
||||
text-align: left
|
||||
|
||||
span
|
||||
width 70%
|
||||
|
||||
&:hover
|
||||
color: $light-blue
|
||||
|
||||
.menus-expand
|
||||
position: absolute
|
||||
width: 30px !important
|
||||
height: 30px
|
||||
right: 0
|
||||
padding: 6px
|
||||
transform: rotate(0deg)
|
||||
transition: all .3s
|
||||
|
||||
&.menus-closed
|
||||
transform: rotate(180deg) !important
|
||||
transition: all .3s
|
||||
|
||||
.menus_item_child
|
||||
list-style: none
|
||||
margin: 0
|
||||
|
||||
#mobile-sidebar-toc
|
||||
padding: 15px 10px
|
||||
|
||||
ol,li
|
||||
list-style: none
|
||||
padding: 0 0 0 5px
|
||||
margin: 0
|
||||
|
||||
|
||||
.toc_mobile_headline
|
||||
text-align: center
|
||||
font-size: 18px
|
||||
font-weight: bold
|
||||
|
||||
a
|
||||
text-decoration: none
|
||||
color: $light-black
|
||||
|
||||
&:hover
|
||||
color: $light-blue
|
||||
|
||||
// 手機打開menus，toc特效
|
||||
.open-mobile-menus,
|
||||
.open-mobile-toc
|
||||
overflow: hidden
|
||||
#body-wrap
|
||||
transform: translateX(-250px)
|
||||
#page-header
|
||||
transform: translateX(-250px)
|
||||
&.fixed.visible
|
||||
transform: translate3d(-250px, 100%, 0)
|
||||
#rightside
|
||||
transform: translate3d(-288px, 0, 0) !important
|
||||
|
||||
.open-mobile-menus
|
||||
#mobile-sidebar
|
||||
#mobile-sidebar-menus
|
||||
transform: translateX(-254px)
|
||||
|
||||
.open-mobile-toc
|
||||
#mobile-sidebar
|
||||
#mobile-sidebar-toc
|
||||
transform: translateX(-254px)
|
||||
|
||||
@media screen and (max-width: $sm)
|
||||
#mobile-sidebar-menus
|
||||
display: block !important
|
||||
|
||||
@media screen and (max-width: $bg)
|
||||
#mobile-sidebar-toc
|
||||
display: block !important
|
||||
|
||||
|
||||
@@ -1,11 +1,17 @@
|
||||
if hexo-config("nightshift") && hexo-config("nightshift.enable")
|
||||
.night-mode
|
||||
color: #99a9bf
|
||||
background-color: #2d3032
|
||||
|
||||
#sidebar
|
||||
background: #2d3035 !important
|
||||
box-shadow: -0.25rem 0 0.25rem #2d3035 !important
|
||||
|
||||
&::-webkit-scrollbar-thumb
|
||||
background: lighten(#2d3035,5)
|
||||
|
||||
#toggle-sidebar
|
||||
color: #99a9bf !important
|
||||
|
||||
if hexo-config("local_search") && hexo-config("local_search.enable")
|
||||
#local-search
|
||||
@@ -66,8 +72,12 @@ if hexo-config("nightshift") && hexo-config("nightshift.enable")
|
||||
.vcontent.expand:after
|
||||
background: hsla(204, 5%, 22%, 1)
|
||||
|
||||
.recent-post-item .article-title
|
||||
color: #99a9bf
|
||||
.recent-post-item
|
||||
background: #2d3032 !important
|
||||
|
||||
.article-title,
|
||||
a
|
||||
color: #99a9bf !important
|
||||
|
||||
#page-header
|
||||
&.fixed
|
||||
@@ -144,7 +154,12 @@ if hexo-config("nightshift") && hexo-config("nightshift.enable")
|
||||
.translate_chn_to_cht,
|
||||
.nightshift,
|
||||
#readmode,
|
||||
#to_comment
|
||||
#to_comment,
|
||||
#font_plus,
|
||||
#font_minus,
|
||||
#rightside_config,
|
||||
#go-up,
|
||||
#mobile-toc-button
|
||||
background-color: #2d3035 !important
|
||||
|
||||
img
|
||||
@@ -207,12 +222,16 @@ if hexo-config("nightshift") && hexo-config("nightshift.enable")
|
||||
#top-container a,
|
||||
#footer,
|
||||
#footer a,
|
||||
#page-header a
|
||||
#page-header a,
|
||||
#page-header .toggle-menu
|
||||
color: rgba(238,238,238,.6)
|
||||
|
||||
#footer
|
||||
background-color: #2d3032
|
||||
|
||||
//打賞 分享
|
||||
.post-reward
|
||||
.reward-buttom
|
||||
.reward-button
|
||||
background-color: #616a6b
|
||||
.post_share
|
||||
filter: brightness(0.6)
|
||||
@@ -222,20 +241,6 @@ if hexo-config("nightshift") && hexo-config("nightshift.enable")
|
||||
&::-webkit-scrollbar-thumb
|
||||
background: lighten(#2d3035,5)
|
||||
|
||||
|
||||
#post_bottom
|
||||
background: #2d3035
|
||||
box-shadow: 0 -5px 6px -5px rgba(133,133,133,0)
|
||||
|
||||
i
|
||||
color: #99a9bf !important
|
||||
|
||||
#toc_mobile
|
||||
background: #2d3035
|
||||
|
||||
a
|
||||
color: #99a9bf !important
|
||||
|
||||
#web_bg
|
||||
background-color: #2d3032
|
||||
|
||||
@@ -246,46 +251,34 @@ if hexo-config("nightshift") && hexo-config("nightshift.enable")
|
||||
background-color: #616a6b
|
||||
|
||||
|
||||
@media screen and (max-width: 768px)
|
||||
.night-mode
|
||||
color: #99a9bf
|
||||
background-color: rgb(45, 48, 53)
|
||||
#mobile-sidebar
|
||||
#mobile-sidebar-menus
|
||||
background: #2d3035
|
||||
|
||||
#page-header
|
||||
.menus
|
||||
background: #2d3035
|
||||
|
||||
.headline
|
||||
color: #99a9bf !important
|
||||
|
||||
.length_num
|
||||
color: darken(#99a9bf,10) !important
|
||||
a
|
||||
color: #99a9bf !important
|
||||
.menu-icon-first,
|
||||
.menu-icon-second,
|
||||
.menu-icon-third
|
||||
background-color: #99a9bf !important
|
||||
|
||||
|
||||
@media screen and (min-width: 768px)
|
||||
.night-mode
|
||||
color: #99a9bf
|
||||
background-color: #2d3032
|
||||
.headline
|
||||
color: #99a9bf !important
|
||||
|
||||
.recent-post-item
|
||||
background: #2d3035 !important
|
||||
.length_num
|
||||
color: darken(#99a9bf,10) !important
|
||||
a
|
||||
color: #99a9bf !important
|
||||
|
||||
#page-header
|
||||
.menus_item_child
|
||||
background-color: #2d3035 !important
|
||||
#mobile-sidebar-toc
|
||||
background: #2d3035
|
||||
a
|
||||
color: #99a9bf !important
|
||||
|
||||
&:before
|
||||
border-color: transparent transparent #2d3035 !important
|
||||
|
||||
li
|
||||
a
|
||||
color: #99a9bf
|
||||
#page-header
|
||||
.menus_item_child
|
||||
background-color: #2d3035 !important
|
||||
|
||||
&:before
|
||||
border-color: transparent transparent #2d3035 !important
|
||||
|
||||
li
|
||||
a
|
||||
color: #99a9bf
|
||||
|
||||
|
||||
|
||||
|
||||
@@ -39,10 +39,10 @@
|
||||
|
||||
p, ul, ol, table, pre, blockquote, img
|
||||
&:first-child
|
||||
margin-top: 0
|
||||
margin-top: 0 !important
|
||||
|
||||
&:last-child
|
||||
margin-bottom: 0
|
||||
margin-bottom: 0 !important
|
||||
|
||||
|
||||
if ($note-icons)
|
||||
|
||||
@@ -125,20 +125,25 @@ galleryItemStyle(w, h)
|
||||
color: $light-blue !important
|
||||
|
||||
.tag-cloud
|
||||
padding: 1.5rem 1rem 2rem
|
||||
text-align: center
|
||||
padding: 40px 44px 44px
|
||||
|
||||
a
|
||||
display: inline-block
|
||||
margin: 0 0.4rem
|
||||
text-decoration: none
|
||||
cursor: pointer
|
||||
transition: all .3s
|
||||
|
||||
&:hover
|
||||
color: $ruby !important
|
||||
transform: scale(1.1)
|
||||
|
||||
&__title
|
||||
font-size: 1.8rem
|
||||
text-align: center
|
||||
|
||||
&-tags
|
||||
text-align: center
|
||||
|
||||
#tag,
|
||||
#category,
|
||||
@@ -186,7 +191,7 @@ galleryItemStyle(w, h)
|
||||
|
||||
&-item
|
||||
position: relative
|
||||
margin-bottom: 1rem
|
||||
margin: 0 0 1rem 0.5rem
|
||||
transition: all 0.2s ease-in-out
|
||||
|
||||
&:hover
|
||||
@@ -196,8 +201,8 @@ galleryItemStyle(w, h)
|
||||
&:before
|
||||
$w = 0.3rem
|
||||
position: absolute
|
||||
top: 0.48rem
|
||||
left: calc(-1rem - 7px)
|
||||
top: 1.8rem
|
||||
left: calc(-1rem - 17px)
|
||||
width: w = $w
|
||||
height: h = w
|
||||
border: 0.5 * w solid $light-blue
|
||||
@@ -217,20 +222,57 @@ galleryItemStyle(w, h)
|
||||
&:before
|
||||
top: 0.7rem
|
||||
border-color: $ruby
|
||||
|
||||
|
||||
&__time
|
||||
position: absolute
|
||||
top: 0.1rem
|
||||
color: $a-link-color
|
||||
font-size: 0.7rem
|
||||
padding-left: 0.4rem
|
||||
|
||||
&__title
|
||||
display: block
|
||||
margin-left: 5rem
|
||||
color: $font-black
|
||||
font-size: 0.75rem
|
||||
height: 60px
|
||||
overflow: hidden
|
||||
display: -webkit-box
|
||||
-webkit-line-clamp: 2
|
||||
-webkit-box-orient: vertical
|
||||
transition: all .3s
|
||||
|
||||
&:hover
|
||||
color: $light-blue
|
||||
transform: translateX(20px)
|
||||
|
||||
&__img
|
||||
img
|
||||
height: 100%
|
||||
width: 100%
|
||||
object-fit: cover
|
||||
padding: 0
|
||||
transition: all .6s
|
||||
|
||||
&:hover
|
||||
transform: scale(1.1)
|
||||
|
||||
&__post
|
||||
text-decoration: none
|
||||
font-size: 0.8rem
|
||||
cursor: pointer
|
||||
|
||||
&:hover
|
||||
color: $a-link-color
|
||||
|
||||
&-img
|
||||
height: 80px
|
||||
width: 80px
|
||||
display: inline-block
|
||||
overflow: hidden
|
||||
|
||||
&-post
|
||||
display: inline-block
|
||||
top: 0
|
||||
position: absolute
|
||||
margin-left: 1rem
|
||||
|
||||
|
||||
.category-lists
|
||||
padding: 1rem 0 1.5rem
|
||||
|
||||
|
||||
@@ -22,7 +22,8 @@
|
||||
color: $white
|
||||
cursor: default
|
||||
|
||||
img.prev_cover, img.next_cover
|
||||
img.prev_cover,
|
||||
img.next_cover
|
||||
position: absolute
|
||||
padding: 0
|
||||
top: 0
|
||||
|
||||
@@ -385,14 +385,13 @@ img
|
||||
|
||||
|
||||
// 文章字體
|
||||
#post-content p {
|
||||
#post-content p
|
||||
font-size: 1.1em
|
||||
}
|
||||
|
||||
#post-content ol, #post-content ul {
|
||||
|
||||
#post-content ol,
|
||||
#post-content ul
|
||||
font-size: 1em
|
||||
}
|
||||
|
||||
|
||||
|
||||
@media screen and (max-width: 1024px)
|
||||
@@ -400,33 +399,21 @@ img
|
||||
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
|
||||
|
||||
@@ -455,4 +442,35 @@ img
|
||||
#post
|
||||
a
|
||||
text-decoration: none
|
||||
color: $light-blue
|
||||
color: $light-blue
|
||||
|
||||
h1
|
||||
margin: 0.8rem 0
|
||||
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6
|
||||
margin: 1rem 0 0.5rem 0
|
||||
|
||||
img
|
||||
margin: 0 auto 0.8rem
|
||||
|
||||
blockquote,
|
||||
p
|
||||
margin: 0 0 0.8rem 0
|
||||
|
||||
|
||||
table,.note
|
||||
margin: 0.8rem 0
|
||||
|
||||
figure
|
||||
margin: 0.8rem 0
|
||||
|
||||
table
|
||||
margin: 0
|
||||
|
||||
blockquote
|
||||
p
|
||||
margin: 0.5rem 0
|
||||
|
||||
@@ -1,70 +0,0 @@
|
||||
#post_bottom
|
||||
position: fixed
|
||||
bottom: -50px
|
||||
background: alpha($white, 0.8)
|
||||
width: 100%
|
||||
border: none
|
||||
box-shadow: 0 -5px 6px -5px alpha($grey, 0.6)
|
||||
display: none
|
||||
transition: all .2s
|
||||
cursor: pointer
|
||||
z-index: 100
|
||||
|
||||
&.toc_mobile_show
|
||||
bottom: 0
|
||||
|
||||
#mobile_to_comment,#mobile_toc
|
||||
width: 50%
|
||||
text-align: center
|
||||
font-size: 18px
|
||||
padding: 7px 0
|
||||
display: inline-block
|
||||
color: $light-black
|
||||
|
||||
a
|
||||
text-decoration: none
|
||||
color: $light-black
|
||||
|
||||
#toc_mobile
|
||||
box-shadow: 0 0 4px alpha($grey, 0.6)
|
||||
background: $white
|
||||
width: 50%
|
||||
height: 70%
|
||||
position: fixed
|
||||
bottom: 60px
|
||||
right: 10px
|
||||
overflow: scroll
|
||||
padding: 15px 10px
|
||||
font-size: 15px
|
||||
border-radius: 10px
|
||||
display: none
|
||||
|
||||
ol,li
|
||||
list-style: none
|
||||
padding: 0 0 0 5px
|
||||
margin: 0
|
||||
|
||||
a
|
||||
&:hover
|
||||
color: $light-blue
|
||||
|
||||
.toc_mobile_headline
|
||||
text-align: center
|
||||
font-size: 18px
|
||||
font-weight: bold
|
||||
|
||||
&.no_comment_show
|
||||
#mobile_toc
|
||||
width: 100%
|
||||
padding: 16px 0
|
||||
|
||||
#toc_mobile
|
||||
right: 25%
|
||||
|
||||
&.no_toc_show
|
||||
#mobile_to_comment
|
||||
width: 100%
|
||||
|
||||
@media screen and (max-width:768px)
|
||||
#post_bottom
|
||||
display: block
|
||||
@@ -7,47 +7,49 @@ if hexo-config("readmode") && hexo-config("readmode.enable")
|
||||
#toggle-sidebar
|
||||
display: none
|
||||
|
||||
#page-header
|
||||
#site-name,
|
||||
.site-page,
|
||||
.toggle-menu
|
||||
text-shadow: none
|
||||
color: $font-black
|
||||
|
||||
.menus_item_child
|
||||
background-color: darken($pale-yellow,5) !important
|
||||
|
||||
&:before
|
||||
border-color: transparent transparent darken($pale-yellow,5) !important
|
||||
|
||||
#top-container
|
||||
background-image: none !important
|
||||
height: 14rem
|
||||
background-color: $pale-yellow
|
||||
|
||||
a
|
||||
color: #4c4948
|
||||
|
||||
color: $font-black
|
||||
|
||||
&:before
|
||||
opacity: 0
|
||||
|
||||
#site-name,
|
||||
.site-page
|
||||
text-shadow: none
|
||||
color: #4c4948
|
||||
|
||||
|
||||
#post-info
|
||||
text-align: center
|
||||
padding: 0
|
||||
color: #4c4948
|
||||
color: $font-black
|
||||
|
||||
#post-title,
|
||||
#post-meta
|
||||
text-shadow: none
|
||||
|
||||
#page-header
|
||||
&.fixed
|
||||
background: alpha(darken($pale-yellow,5),0.5)
|
||||
box-shadow: none
|
||||
#page-header
|
||||
&.fixed
|
||||
background: alpha(darken($pale-yellow,5),0.5)
|
||||
box-shadow: none
|
||||
|
||||
&.open-sidebar
|
||||
.site-page
|
||||
display: inline-block
|
||||
opacity: 1
|
||||
&.open-sidebar
|
||||
.site-page
|
||||
display: inline-block
|
||||
opacity: 1
|
||||
|
||||
.toggle-menu
|
||||
.menu-icon-first,
|
||||
.menu-icon-second,
|
||||
.menu-icon-third
|
||||
background-color: #4c4948
|
||||
|
||||
.layout_post
|
||||
box-shadow: none
|
||||
@@ -98,31 +100,6 @@ if hexo-config("readmode") && hexo-config("readmode.enable")
|
||||
|
||||
.copy-notice
|
||||
background: darken($pale-yellow,10)
|
||||
|
||||
.toc_mobile_show
|
||||
background: alpha(darken($pale-yellow,5),0.5) !important
|
||||
box-shadow: none !important
|
||||
|
||||
#post_bottom_items
|
||||
#mobile_to_comment
|
||||
display: none
|
||||
#mobile_toc
|
||||
width: 100%
|
||||
padding: 16px 0
|
||||
#toc_mobile
|
||||
right: 25%
|
||||
background: darken($pale-yellow,5)
|
||||
|
||||
|
||||
@media screen and (min-width: 768px)
|
||||
.read-mode
|
||||
.menus_item_child
|
||||
background-color: darken($pale-yellow,5) !important
|
||||
|
||||
&:before
|
||||
border-color: transparent transparent darken($pale-yellow,5) !important
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
@@ -5,7 +5,7 @@
|
||||
text-align: center
|
||||
display: block
|
||||
|
||||
.reward-buttom
|
||||
.reward-button
|
||||
text-align: center
|
||||
display: inline-block
|
||||
cursor: pointer
|
||||
|
||||
64
source/css/_layout/rightside.styl
Normal file
64
source/css/_layout/rightside.styl
Normal file
@@ -0,0 +1,64 @@
|
||||
#rightside
|
||||
right: -38px
|
||||
position: fixed
|
||||
bottom: 40px
|
||||
transition: all .3s
|
||||
opacity 0
|
||||
|
||||
#rightside-config-hide
|
||||
transition: all .3s
|
||||
display none
|
||||
|
||||
#readmode,
|
||||
#font_plus,
|
||||
#font_minus,
|
||||
#to_comment,
|
||||
.nightshift,
|
||||
#mobile-toc-button,
|
||||
#go-up,
|
||||
#rightside_config
|
||||
width: 30px
|
||||
height: 30px
|
||||
background-color: $light-blue
|
||||
color: $white
|
||||
text-align: center
|
||||
line-height: 29px
|
||||
font-size: 16px
|
||||
display: block
|
||||
margin-bottom: 2px
|
||||
cursor: pointer
|
||||
text-decoration: none
|
||||
|
||||
&:hover
|
||||
background-color: $ruby
|
||||
|
||||
#rightside_config
|
||||
i
|
||||
animation: avatar_turn_around 2s linear infinite
|
||||
|
||||
.translate_chn_to_cht
|
||||
width: 30px
|
||||
height: 30px
|
||||
background-color: $light-blue
|
||||
color: $white
|
||||
text-align: center
|
||||
line-height: 29px
|
||||
font-size: 16px
|
||||
display: block
|
||||
margin-bottom: 2px
|
||||
cursor: pointer
|
||||
text-decoration: none
|
||||
|
||||
&:hover
|
||||
background-color: $ruby
|
||||
|
||||
#mobile-toc-button
|
||||
display: none
|
||||
|
||||
|
||||
@media screen and (max-width: $bg)
|
||||
#rightside
|
||||
#mobile-toc-button
|
||||
display: block
|
||||
|
||||
|
||||
@@ -41,35 +41,33 @@
|
||||
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
|
||||
|
||||
|
||||
.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
|
||||
|
||||
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
|
||||
.content
|
||||
display: -webkit-box
|
||||
-webkit-line-clamp: 3
|
||||
-webkit-box-orient: vertical
|
||||
overflow: hidden
|
||||
height: 90px
|
||||
|
||||
.layout_page
|
||||
display: flex
|
||||
@@ -93,19 +91,14 @@ a.article-meta__categories
|
||||
.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)
|
||||
|
||||
|
||||
|
||||
@media screen and (min-width: 900px)
|
||||
if hexo-config("aside.position") == "left"
|
||||
#recent-posts
|
||||
#recent-posts,#page,.category-content,#archive,.tag-cloud,.flink,#tag,#category
|
||||
order: 2
|
||||
|
||||
#page,.category-content,#archive,.tag-cloud,.flink,#tag,#category
|
||||
order: 2
|
||||
|
||||
|
||||
@media screen and (max-width: 900px)
|
||||
#page,.category-content,#archive,.tag-cloud,.flink,#tag,#category
|
||||
@@ -121,9 +114,9 @@ a.article-meta__categories
|
||||
border-radius: 8px
|
||||
|
||||
.post_cover
|
||||
width: 100% !important
|
||||
height: 230px !important
|
||||
border-radius: 8px !important
|
||||
width: 100% !important
|
||||
height: 230px !important
|
||||
border-radius: 8px !important
|
||||
|
||||
.recent-post-item,#page,.tag-cloud,.flink
|
||||
margin-top: 1px
|
||||
@@ -164,12 +157,13 @@ a.article-meta__categories
|
||||
.category-lists
|
||||
padding: 0
|
||||
|
||||
.recent-post-info
|
||||
padding: 20px 10px !important
|
||||
width: 100%
|
||||
#recent-posts
|
||||
.recent-post-info
|
||||
padding: 20px 10px !important
|
||||
width: 100%
|
||||
|
||||
#recent-posts #pagination
|
||||
margin-bottom: 0
|
||||
#pagination
|
||||
margin-bottom: 0
|
||||
|
||||
#nav
|
||||
#site-social-icons
|
||||
@@ -202,17 +196,20 @@ footer
|
||||
animation: main 1s
|
||||
|
||||
#nav,
|
||||
#top-container
|
||||
#top-container,
|
||||
#page-header
|
||||
animation: header 1s
|
||||
|
||||
#site-title
|
||||
animation: titlescale 1s
|
||||
|
||||
canvas,#web_bg
|
||||
canvas,
|
||||
#web_bg
|
||||
animation: to_show 4s
|
||||
|
||||
.card-announcement-animation
|
||||
animation: announ_animation 1.5s infinite
|
||||
animation: announ_animation .8s linear infinite
|
||||
color: #FF0000
|
||||
|
||||
.scroll-down-effects
|
||||
animation: scroll-down-effect 1.5s infinite
|
||||
@@ -222,8 +219,11 @@ if hexo-config("avatar_effect") == true
|
||||
animation: avatar_turn_around 2s linear infinite
|
||||
|
||||
.reward-main
|
||||
animation: donate_effcet .3s .1s ease both;
|
||||
animation: donate_effcet .3s .1s ease both
|
||||
|
||||
.rightside-in
|
||||
animation: rightside_in_animate .3s
|
||||
display: block !important
|
||||
|
||||
@keyframes scroll-down-effect
|
||||
0%
|
||||
@@ -286,4 +286,17 @@ if hexo-config("avatar_effect") == true
|
||||
transform: translateY(-20px)
|
||||
100%
|
||||
opacity: 1
|
||||
transform: translateY(0)
|
||||
transform: translateY(0)
|
||||
|
||||
@keyframes announ_animation
|
||||
0%,to
|
||||
transform: scale(1)
|
||||
50%
|
||||
transform: scale(1.2)
|
||||
|
||||
@keyframes rightside_in_animate
|
||||
0%
|
||||
transform: translateX(28px)
|
||||
100%
|
||||
transform: translateX(0)
|
||||
|
||||
|
||||
Reference in New Issue
Block a user