From c0e966722b0cd8ab4e65e2ff261cc3a24a406740 Mon Sep 17 00:00:00 2001
From: "L. E. Segovia" <13498015+amyspark@users.noreply.github.com>
Date: Sat, 17 Nov 2018 18:41:24 +0000
Subject: [PATCH] Fix username emojification in sidebar

---
 .../Contents/SideBar/AccountProfile.vue             | 13 +++++++++----
 1 file changed, 9 insertions(+), 4 deletions(-)

diff --git a/src/renderer/components/TimelineSpace/Contents/SideBar/AccountProfile.vue b/src/renderer/components/TimelineSpace/Contents/SideBar/AccountProfile.vue
index 3d36e150..5eb5cdbd 100644
--- a/src/renderer/components/TimelineSpace/Contents/SideBar/AccountProfile.vue
+++ b/src/renderer/components/TimelineSpace/Contents/SideBar/AccountProfile.vue
@@ -60,8 +60,7 @@
           </div>
         </div>
       </div>
-      <div class="username">
-        {{ username(account) }}
+      <div class="username" v-html="username(account)">
       </div>
       <div class="account">
         @{{ account.acct }}
@@ -110,6 +109,7 @@
 import { mapState } from 'vuex'
 import { shell } from 'electron'
 import { findLink } from '~/src/renderer/utils/tootParser'
+import emojify from '~/src/renderer/utils/emojify'
 import Timeline from './AccountProfile/Timeline'
 import Follows from './AccountProfile/Follows'
 import Followers from './AccountProfile/Followers'
@@ -158,7 +158,7 @@ export default {
   methods: {
     username (account) {
       if (account.display_name !== '') {
-        return account.display_name
+        return emojify(account.display_name, account.emojis)
       } else {
         return account.username
       }
@@ -315,11 +315,16 @@ export default {
       }
     }
 
-    .username {
+    .username /deep/ {
       overflow: hidden;
       text-overflow: ellipsis;
       font-size: calc(var(--base-font-size) * 1.71);
       margin: 0 auto 12px auto;
+
+      .emojione {
+        max-width: 1em;
+        max-height: 1em;
+      }
     }
 
     .account {