80 lines
1.3 KiB
Stylus
80 lines
1.3 KiB
Stylus
|
.links
|
||
|
.card
|
||
|
box-shadow none
|
||
|
min-width 33%
|
||
|
background-color transparent
|
||
|
border 0
|
||
|
|
||
|
.card-body
|
||
|
margin 1rem 0
|
||
|
padding 1rem
|
||
|
border-radius .3rem
|
||
|
display block
|
||
|
width 100%
|
||
|
height 100%
|
||
|
|
||
|
&:hover
|
||
|
.link-avatar
|
||
|
transform scale(1.1)
|
||
|
|
||
|
.card-content
|
||
|
display flex
|
||
|
flex-wrap nowrap
|
||
|
width 100%
|
||
|
height 3.5rem
|
||
|
|
||
|
.link-avatar
|
||
|
flex none
|
||
|
width 3rem
|
||
|
height 3rem
|
||
|
margin-right .75rem
|
||
|
object-fit cover
|
||
|
transition-duration .2s
|
||
|
transition-timing-function ease-in-out
|
||
|
|
||
|
img
|
||
|
width 100%
|
||
|
height 100%
|
||
|
border-radius 50%
|
||
|
background-color transparent
|
||
|
object-fit cover
|
||
|
|
||
|
.link-text
|
||
|
flex 1
|
||
|
display grid
|
||
|
flex-direction column
|
||
|
line-height 1.5
|
||
|
|
||
|
.link-title
|
||
|
overflow hidden
|
||
|
text-overflow ellipsis
|
||
|
white-space nowrap
|
||
|
color var(--text-color)
|
||
|
font-weight bold
|
||
|
|
||
|
.link-intro
|
||
|
max-height 2rem
|
||
|
font-size 0.85rem
|
||
|
line-height 1.2
|
||
|
color var(--sec-text-color)
|
||
|
display -webkit-box
|
||
|
-webkit-box-orient vertical
|
||
|
-webkit-line-clamp 2
|
||
|
text-overflow ellipsis
|
||
|
overflow hidden
|
||
|
|
||
|
@media (max-width 767px)
|
||
|
.links
|
||
|
display flex
|
||
|
flex-direction column
|
||
|
justify-content center
|
||
|
align-items center
|
||
|
|
||
|
.card
|
||
|
padding-left 2rem
|
||
|
padding-right 2rem
|
||
|
|
||
|
@media (min-width 768px)
|
||
|
.link-text:only-child
|
||
|
margin-left 1rem
|