mirror of
https://github.com/jerryc127/hexo-theme-butterfly.git
synced 2025-09-15 12:58:48 +08:00
54 lines
1023 B
Stylus
54 lines
1023 B
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%
|
|
color: $white
|
|
transform: translate(0, -50%)
|
|
|
|
.relatedPosts_date
|
|
color: $light-grey
|
|
font-size: 90%
|
|
|
|
.relatedPosts_title
|
|
@extend .limit-more-line
|
|
-webkit-line-clamp: 2
|