Add translation, linkify avatar

webapp/locales/en.json

@@ -15,7 +15,8 @@
     "followers": "Followers",
     "following": "Following",
     "shouted": "Shouted",
-    "commented": "Commented"
+    "commented": "Commented",
+    "socialMedia": "Where else can I find"
   },
   "search": {
     "placeholder": "Search",

webapp/pages/profile/_id/_slug.vue

@@ -203,6 +203,10 @@
           </template>
         </ds-card>
         <ds-space />
+        <ds-space 
+          v-if="user.socialMedia && user.socialMedia.length"
+          margin="x-small"
+        />
         <ds-card style="position: relative; height: auto;">
           <ds-space
             v-if="user.socialMedia && user.socialMedia.length"
@@ -212,7 +216,7 @@
               tag="h5"
               color="soft"
             >
-              Where else can I find {{ user.name | truncate(15) }}?
+              {{ $t('profile.socialMedia') }} {{ user.name | truncate(15) }}?
             </ds-text>
             <template v-if="user.socialMedia && user.socialMedia.length">
               <ds-space
@@ -221,10 +225,10 @@
                 margin="x-small"
               >
                 <!-- TODO: find better solution for rendering errors -->
+                <a :href="link.url">
                   <ds-avatar
                     :image="link.favicon"
                   />
-                <a :href="link.url">
                   {{ link.username }}
                 </a>
               </ds-space>