Files
hexo-theme-butterfly/source/css/_layout/relatedposts.styl
Jerry 507453671a 🐛 適配hexo 5.0.0 修復toc點擊不會跳轉的bugs
🐛 適配hexo 5.0.0 修復toc點擊不會跳轉的bugs
🍻 文件整理
🍻 UI微調
2020-08-01 01:50:01 +08:00

54 lines
1.0 KiB
Stylus

.relatedPosts
margin-top: 1rem
.relatedPosts_headline
margin-bottom: 5px
font-weight: 700
font-size: 20px
.relatedPosts_item
position: relative
display: inline-block
overflow: hidden
margin: 3px
width: calc(33.333% - 6px)
height: 200px
background: $dark-black
vertical-align: bottom
&:hover
.relatedPosts_cover
opacity: .8
transform: scale(1.1)
@media screen and (max-width: 768px)
margin: 2px
width: calc(50% - 4px)
height: 150px
@media screen and (max-width: 480px)
width: calc(100% - 4px)
.relatedPosts_cover
width: 100%
height: 100%
opacity: .4
transition: all .6s
object-fit: cover
.relatedPosts_main
position: absolute
top: 50%
padding: 0 1rem
width: 100%
transform: translate(0, -50%)
.relatedPosts_date
color: var(--light-grey)
font-size: 90%
.relatedPosts_title
@extend .limit-more-line
color: var(--white)
-webkit-line-clamp: 2