2019-08-27 00:39:35 +00:00
|
|
|
const user-card-padding = 1rem
|
|
|
|
|
|
|
|
|
|
.user-cards
|
|
|
|
|
horizontal-wrap
|
|
|
|
|
justify-content center
|
|
|
|
|
|
|
|
|
|
.user-card
|
|
|
|
|
horizontal
|
|
|
|
|
ui-element
|
|
|
|
|
padding user-card-padding
|
|
|
|
|
margin 0.4rem
|
|
|
|
|
width 100%
|
2019-08-28 02:24:39 +00:00
|
|
|
height calc(avatar-size + user-card-padding * 2)
|
2019-08-27 00:39:35 +00:00
|
|
|
|
|
|
|
|
:hover
|
2019-08-28 02:24:39 +00:00
|
|
|
border 1px solid input-focus-border-color
|
|
|
|
|
// TODO: Replace with alpha(main-color, 20%) function
|
|
|
|
|
box-shadow 0 0 6px rgba(248, 165, 130, 0.2)
|
2019-08-27 00:39:35 +00:00
|
|
|
|
2019-08-27 01:09:55 +00:00
|
|
|
> 600px
|
2019-08-27 00:39:35 +00:00
|
|
|
.user-card
|
2019-08-28 02:24:39 +00:00
|
|
|
max-width 230px
|
2019-08-27 00:39:35 +00:00
|
|
|
|
|
|
|
|
.user-card-avatar
|
|
|
|
|
.user-image
|
|
|
|
|
border-radius ui-element-border-radius
|
|
|
|
|
box-shadow none
|
|
|
|
|
|
|
|
|
|
.user-card-info
|
|
|
|
|
vertical
|
|
|
|
|
margin-left user-card-padding
|
|
|
|
|
overflow hidden
|
|
|
|
|
|
|
|
|
|
.user-card-nick
|
|
|
|
|
clip-long-text
|
|
|
|
|
|
|
|
|
|
.user-card-note
|
2019-08-28 02:24:39 +00:00
|
|
|
clip-long-text
|
2019-08-27 00:39:35 +00:00
|
|
|
color text-color
|
|
|
|
|
opacity 0.5
|
