From 8225717a7c5391e21dba00a28aebb642ffcc8cef Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Thu, 29 Oct 2020 20:03:53 +0200
Subject: [PATCH] Update and fix avatar shadow in user card

---
 src/components/user_avatar/user_avatar.vue | 9 ++++++---
 src/components/user_card/user_card.vue     | 6 ++++--
 2 files changed, 10 insertions(+), 5 deletions(-)

diff --git a/src/components/user_avatar/user_avatar.vue b/src/components/user_avatar/user_avatar.vue
index eb3d375eba..4394728268 100644
--- a/src/components/user_avatar/user_avatar.vue
+++ b/src/components/user_avatar/user_avatar.vue
@@ -20,11 +20,14 @@
 @import '../../_variables.scss';
 
 .Avatar {
+  --_avatarShadowBox: var(--avatarStatusShadow);
+  --_avatarShadowFilter: var(--avatarStatusShadowFilter);
+  --_avatarShadowInset: var(--avatarStatusShadowInset);
   --still-image-label-visibility: hidden;
 
   width: 48px;
   height: 48px;
-  box-shadow: var(--avatarStatusShadow);
+  box-shadow: var(--_avatarShadowBox);
   border-radius: $fallback--avatarRadius;
   border-radius: var(--avatarRadius, $fallback--avatarRadius);
 
@@ -34,8 +37,8 @@
   }
 
   &.better-shadow {
-    box-shadow: var(--avatarStatusShadowInset);
-    filter: var(--avatarStatusShadowFilter)
+    box-shadow: var(--_avatarShadowInset);
+    filter: var(--_avatarShadowFilter);
   }
 
   &.animated::before {
diff --git a/src/components/user_card/user_card.vue b/src/components/user_card/user_card.vue
index 55e231d299..52a54fa71a 100644
--- a/src/components/user_card/user_card.vue
+++ b/src/components/user_card/user_card.vue
@@ -382,11 +382,13 @@
     max-height: 56px;
 
     .Avatar {
+      --_avatarShadowBox: var(--avatarShadow);
+      --_avatarShadowFilter: var(--avatarShadowFilter);
+      --_avatarShadowInset: var(--avatarShadowInset);
+
       flex: 1 0 100%;
       width: 56px;
       height: 56px;
-      box-shadow: 0px 1px 8px rgba(0,0,0,0.75);
-      box-shadow: var(--avatarShadow);
       object-fit: cover;
     }
   }