2018-03-18 18:09:58 +00:00
|
|
|
const group-padding-y = 0.75rem
|
|
|
|
|
const group-padding-x = 0.75rem
|
2017-10-18 16:18:15 +00:00
|
|
|
|
2017-10-18 10:02:48 +00:00
|
|
|
.groups
|
2018-11-21 07:37:24 +00:00
|
|
|
display grid
|
|
|
|
|
grid-gap calc(content-padding / 2)
|
|
|
|
|
// grid-template-columns repeat(auto-fill, min(100%, 520px))
|
|
|
|
|
// justify-content center
|
2017-10-18 10:02:48 +00:00
|
|
|
|
|
|
|
|
.group
|
2017-10-18 16:18:15 +00:00
|
|
|
horizontal
|
2017-10-18 10:02:48 +00:00
|
|
|
ui-element
|
|
|
|
|
position relative
|
2018-11-21 07:37:24 +00:00
|
|
|
// width 100%
|
|
|
|
|
// max-width 520px
|
2017-10-18 16:18:15 +00:00
|
|
|
padding group-padding-y group-padding-x
|
|
|
|
|
color text-color
|
|
|
|
|
|
|
|
|
|
:hover
|
2018-03-04 14:43:00 +00:00
|
|
|
color theme-white
|
|
|
|
|
background-color theme-black
|
|
|
|
|
text-shadow none
|
2017-10-18 16:18:15 +00:00
|
|
|
|
|
|
|
|
.group-image
|
|
|
|
|
width 70px
|
|
|
|
|
height 70px
|
|
|
|
|
margin-right 1rem
|
|
|
|
|
border-radius ui-element-border-radius
|
|
|
|
|
|
|
|
|
|
.group-info
|
|
|
|
|
vertical
|
2017-10-18 10:02:48 +00:00
|
|
|
|
|
|
|
|
.group-name
|
|
|
|
|
horizontal
|
|
|
|
|
align-items center
|
|
|
|
|
|
|
|
|
|
.group-tagline
|
|
|
|
|
opacity 0.6
|
|
|
|
|
|
|
|
|
|
.group-member-count
|
|
|
|
|
position absolute
|
|
|
|
|
top 0.5rem
|
|
|
|
|
right 1rem
|
|
|
|
|
text-align right
|
|
|
|
|
font-size 0.8rem
|
|
|
|
|
opacity 0.5
|
