therwi/sunkkoma
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

improve code quality

Browse source
This commit is contained in:
Brenden Bice 2019-04-02 16:00:09 -04:00
parent 8c9bcdc6c1
commit 8a2f55644c
2 changed files with 9 additions and 36 deletions
Download patch file Download diff file Expand all files Collapse all files

35
src/components/avatar_list/avatar_list.vue
View file

@ -1,6 +1,6 @@
<template>
<ul class="avatars" :class="{ 'transparent-avatar': slicedAvatars.length == 15 }">
<li class="avatars-item" v-for="avatar in slicedAvatars" :key="avatar.id">
<ul class="avatars">
<li class="avatars-item" v-for="(avatar, index) in slicedAvatars" :key="`avatar-${index}`">
<UserAvatar :src="avatar.profile_image_url" class="avatars-img" />
</li>
</ul>
@ -18,37 +18,16 @@
flex-direction: row-reverse;
&-item {
height: 30px;
height: 25px;
margin: 0;
padding: 0;
width: 15px;
.avatars-img {
border-radius: 50%;
height: 30px;
width: 30px;
line-height: 30px;
background-color: $main-background;
}
}
}
.transparent-avatar {
.avatars-item {
&:first-child {
position: relative;
.avatars-img {
&::after {
content: '';
position: absolute;
width: 100%;
height: 100%;
background-color: rgba(255, 255, 255, 0.7);
left: 0;
top: 0;
}
}
border-radius: $fallback--avatarAltRadius;
border-radius: var(--avatarAltRadius, $fallback--avatarAltRadius);
height: 25px !important;
width: 25px !important;
}
}
}