diff options
Diffstat (limited to 'src/components/user_avatar/user_avatar.vue')
| -rw-r--r-- | src/components/user_avatar/user_avatar.vue | 17 |
1 files changed, 11 insertions, 6 deletions
diff --git a/src/components/user_avatar/user_avatar.vue b/src/components/user_avatar/user_avatar.vue index bbc99f96..3ec25b21 100644 --- a/src/components/user_avatar/user_avatar.vue +++ b/src/components/user_avatar/user_avatar.vue @@ -1,5 +1,5 @@ <template> - <StillImage class="avatar" :src="imgSrc" :imageLoadError="imageLoadError"/> + <StillImage class="avatar" :class="{ 'avatar-compact': compact, 'better-shadow': betterShadow }" :src="imgSrc" :imageLoadError="imageLoadError"/> </template> <script src="./user_avatar.js"></script> @@ -12,8 +12,11 @@ box-shadow: var(--avatarStatusShadow); border-radius: $fallback--avatarRadius; border-radius: var(--avatarRadius, $fallback--avatarRadius); - overflow: hidden; - position: relative; + + img { + width: 100%; + height: 100%; + } &.better-shadow { box-shadow: var(--avatarStatusShadowInset); @@ -24,9 +27,11 @@ display: none; } - img { - width: 100%; - height: 100%; + &.avatar-compact { + width: 32px; + height: 32px; + border-radius: $fallback--avatarAltRadius; + border-radius: var(--avatarAltRadius, $fallback--avatarAltRadius); } } </style> |