works but hacky

2 files changed, 12 insertions, 2 deletions

diff --git a/src/components/user_card/user_card.js b/src/components/user_card/user_card.js
index ea893567..f0fff335 100644
--- a/src/components/user_card/user_card.js
+++ b/src/components/user_card/user_card.js
@@ -1,4 +1,5 @@
 import UserCardContent from '../user_card_content/user_card_content.vue'
+import StillImage from '../still-image/still-image.vue'
 import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
 
 const UserCard = {
@@ -13,7 +14,8 @@ const UserCard = {
     }
   },
   components: {
-    UserCardContent
+    UserCardContent,
+    StillImage
   },
   computed: {
     currentUser () { return this.$store.state.users.currentUser }
diff --git a/src/components/user_card/user_card.vue b/src/components/user_card/user_card.vue
index 0f163e36..cf69606d 100644
--- a/src/components/user_card/user_card.vue
+++ b/src/components/user_card/user_card.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="card">
     <a href="#">
-      <img @click.prevent="toggleUserExpanded" class="avatar" :src="user.profile_image_url">
+      <StillImage @click.prevent="toggleUserExpanded" class="avatar" :src="user.profile_image_url"/>
     </a>
     <div class="usercard" v-if="userExpanded">
       <user-card-content :user="user" :switcher="false"></user-card-content>
@@ -41,6 +41,14 @@
   margin-top:0.0em;
   text-align: left;
   width: 100%;
+  .user-name {
+    img {
+      object-fit: contain;
+      height: 16px;
+      width: 16px;
+      vertical-align: middle;
+    }
+  }
 }
 
 .follows-you {