Files
hexo-theme-butterfly/source/css/_layout/aside.styl
Jerry eae694806c v2.1.0
1. 可設置隱藏文章
2. 適配 Hexo 的 Tag Plugins Code Block With marked lines 顯示
3. 可配置首頁cover顯示的位置
4. 更改深色模式下的配色
5. activate_power_mode 增加關閉顏色和抖動
6. 增加谷歌廣告,騰訊分析
7. 相關文章增加時間顯示,調整佈局,垂直居中
8. 文章頁面,top_img增加評論數顯示
9. 可以取消點擊圖片觀看大圖
10. mathjax和kathex可設置每頁都加載還是按需加載
11. 深色模式下,滾動條顔色的適配
12. 優化gitalk 在 dark mode下的顯示
13. 文章頁,文章標題過長時,只顯示三行內容
14. 深色模式下,背景圖片加上蒙板
15. 優化深色/閲讀模式下,canvas的顯示
16. 優化打賞的特效和移動到二維碼不會立刻消失
17. 優化sub-menu樣式
18. 修改aside 的tags顔色,在深色模式下不會出現觀看困難
19. 升級 normalize.css 到最新版
20. 優化手機上toc和menu的打開動畫
21. 優化代碼框打開關閉的特效
22. 精簡js,部分操作改為css控制
23. 優化主題的一些動畫,不會過於生硬

1. 修復當圖片被a標簽包圍時,點擊圖標沒有跳轉到對應網頁而是出現大圖觀看模式的bug
2. 修復當網址有subdirectory時,menu、打賞二維碼和lodding_bg 鏈接路徑錯誤的bug
3. 修復當網址有subdirectory時,
4. 修復katex 的 CSS無法讀取bug
5. 修復搜索按鈕在文章頁不顯示的bug
6. 修復gitalk css引用失敗的bug
7. 修復 點擊特效 煙花 無效的bug
8. 修復gitalk報path.startsWith is not a function的bug
9. 修復 閲讀模式下,背景沒有變純色的bug
10. 修復閲讀模式下,header 偶爾出現沒有靠攏頂部的bug
11. 修復Hexo Tag Plugins Block Quote 裏的鏈接顯示出外面的Bug
12. 修復aside歸檔日期過長導致錯位的bug
13. 修復toc為空時,toc按鈕仍存在的bug
14. 修復關閉懶加載後,頭像無法顯示的bug
15. 修復深色模式下,切換readmode偶爾會無效的bug
16. 修復在一些手機設備上,toc和menu的按鈕顯示不對齊的bug #72
2019-12-20 02:19:43 +08:00

226 lines
4.5 KiB
Stylus

#aside_content
width: 25%
.card-widget
overflow: hidden
margin-top: 20px
border-radius: 8px
background: $white
box-shadow: 0 4px 8px 6px rgba(7, 17, 27, .06)
transition: all .3s
&:hover
box-shadow: 0 4px 12px 12px rgba(7, 17, 27, .15)
.card-info
img
display: inline-block
padding: 5px
width: 120px
height: 120px
border-radius: 70px
vertical-align: top
transition: all .3s
&:hover
transform: rotate(540deg)
.author-info
&__name
font-weight: 500
font-size: 1.1rem
&__description
margin-top: -.3rem
.card-info-data
display: flex
padding: .7rem 0
& > .card-info-data-item
flex: 1 1
min-width: 0
a
text-decoration: none
.headline
display: block
overflow: hidden
color: $font-black
text-transform: uppercase
text-overflow: ellipsis
white-space: nowrap
font-size: .7rem
.length_num
color: $dark-black
font-size: 1rem
.card-info-social-icons
margin: .3rem 0 -.3rem
.social-icon
margin: 0 .5rem
color: $font-black
font-size: 1rem
cursor: pointer
i
transition: all .3s
&:hover
transform: rotate(540deg)
#bookmark-it
position: relative
z-index: 1
display: block
background-color: $light-blue
color: $white
text-decoration: none
text-transform: uppercase
line-height: 1.6rem
span
padding-left: .5rem
.card-content
padding: 1rem 1.2rem
.item-headline
font-size: .8rem
span
margin-left: .5rem
.card-tag-cloud
a
text-decoration: none
word-break: keep-all
&:hover
color: $light-blue !important
.card-recent-post
.aside-recent-item
margin: 10px 0 -15px
& > .aside-recent-post
margin-bottom: 10px
& > a
color: $font-black
text-decoration: none
.aside-post-cover
float: left
overflow: hidden
width: 66px
height: 66px
.aside-post-bg
padding: 0
max-width: 100%
width: 100%
height: 100%
transition: all .6s
object-fit: cover
&:hover
box-shadow: none
transform: scale(1.1)
.aside-post-title
.aside-post_meta
padding-left: 10px
color: $theme-link-color
font-size: .6rem
.aside-post_title
display: -webkit-box
overflow: hidden
padding-left: 10px
height: 40px
line-height: 1rem
-webkit-line-clamp: 2
-webkit-box-orient: vertical
&:hover
color: $light-blue !important
.card-archives ul.archive-list,
.card-categories ul.aside-category-item
margin: 0
padding: .2rem 0 0
list-style: none
.card-archives ul.archive-list > .archive-list-item,
.card-categories ul.aside-category-item > .aside-category-list
padding: .2rem 1rem
cursor: pointer
transition: all .3s
&:hover
padding: .2rem .85rem
background-color: $light-blue
color: #363636
a
display: flex
color: $font-black
text-decoration: none
span
&:first-child
flex: auto
overflow: hidden
text-overflow: ellipsis
white-space: nowrap
.card-categories
.aside-category-item
&.child
padding: 0 0 0 1.2rem
.card-archives
.archive-list-link-more
justify-content: center
.card-webinfo
.webinfo
padding: .2rem 1rem
.webinfo-item
display: block
padding: 4px 0 0
div
&:first-child
display: inline-block
&:last-child
display: inline-block
float: right
@media screen and (max-width: 900px)
.layout_page
flex-direction: column
#recent-posts,
#aside_content
width: 100% !important
@media screen and (min-width: 900px)
#aside_content
.card-widget
if hexo-config('aside.position') == 'right'
margin-left: 15px
else
margin-right: 15px
if hexo-config('aside_mobile') == false
@media screen and (max-width: $sm)
#aside_content
display: none