avatar shadows

4 files changed, 27 insertions, 5 deletions

diff --git a/src/components/avatar.style.js b/src/components/avatar.style.js
new file mode 100644
index 00000000..2262fd03
--- /dev/null
+++ b/src/components/avatar.style.js
@@ -0,0 +1,20 @@
+export default {
+  name: 'Avatar',
+  selector: '.Avatar',
+  defaultRules: [
+    {
+      directives: {
+        background: '--bg',
+        opacity: 0,
+        shadow: [{
+          x: 0,
+          y: 1,
+          blur: 8,
+          spread: 0,
+          color: '#000000',
+          alpha: 0.7
+        }]
+      }
+    }
+  ]
+}
diff --git a/src/components/notification.style.js b/src/components/notification.style.js
index 057b1c7a..0802da77 100644
--- a/src/components/notification.style.js
+++ b/src/components/notification.style.js
@@ -9,7 +9,8 @@ export default {
     'Button',
     'ButtonUnstyled',
     'RichContent',
-    'Input'
+    'Input',
+    'Avatar'
   ],
   defaultRules: [
     {
diff --git a/src/components/post.style.js b/src/components/post.style.js
index 92ec230a..f4bd12a6 100644
--- a/src/components/post.style.js
+++ b/src/components/post.style.js
@@ -9,7 +9,8 @@ export default {
     'Button',
     'ButtonUnstyled',
     'RichContent',
-    'Input'
+    'Input',
+    'Avatar'
   ],
   defaultRules: [
     {
diff --git a/src/components/user_avatar/user_avatar.vue b/src/components/user_avatar/user_avatar.vue
index 91c17611..2f2ba25a 100644
--- a/src/components/user_avatar/user_avatar.vue
+++ b/src/components/user_avatar/user_avatar.vue
@@ -30,9 +30,9 @@
 @import "../../variables";
 
 .Avatar {
-  --_avatarShadowBox: var(--avatarStatusShadow);
-  --_avatarShadowFilter: var(--avatarStatusShadowFilter);
-  --_avatarShadowInset: var(--avatarStatusShadowInset);
+  --_avatarShadowBox: var(--shadow);
+  --_avatarShadowFilter: var(--shadowFilter);
+  --_avatarShadowInset: var(--shadowInset);
   --_still-image-label-visibility: hidden;
 
   display: inline-block;