More stuff. Buttons in user card's corner now have MUCH bigger hitboxes

3 files changed, 15 insertions, 5 deletions

diff --git a/src/components/chat_new/chat_new.js b/src/components/chat_new/chat_new.js
index d023efc0..71585995 100644
--- a/src/components/chat_new/chat_new.js
+++ b/src/components/chat_new/chat_new.js
@@ -1,6 +1,16 @@
 import { mapState, mapGetters } from 'vuex'
 import BasicUserCard from '../basic_user_card/basic_user_card.vue'
 import UserAvatar from '../user_avatar/user_avatar.vue'
+import { library } from '@fortawesome/fontawesome-svg-core'
+import {
+  faSearch,
+  faChevronLeft
+} from '@fortawesome/free-solid-svg-icons'
+
+library.add(
+  faSearch,
+  faChevronLeft
+)
 
 const chatNew = {
   components: {
diff --git a/src/components/chat_new/chat_new.scss b/src/components/chat_new/chat_new.scss
index 11305444..716172b0 100644
--- a/src/components/chat_new/chat_new.scss
+++ b/src/components/chat_new/chat_new.scss
@@ -8,9 +8,7 @@
     }
   }
 
-  .icon-search {
-    font-size: 1.5em;
-    float: right;
+  .search-icon {
     margin-right: 0.3em;
   }
 
@@ -25,5 +23,7 @@
 
   .go-back-button {
     cursor: pointer;
+    margin-right: 1.7em;
+    margin-left: 0.3em;
   }
 }
diff --git a/src/components/chat_new/chat_new.vue b/src/components/chat_new/chat_new.vue
index 3333dbf9..95eebe6b 100644
--- a/src/components/chat_new/chat_new.vue
+++ b/src/components/chat_new/chat_new.vue
@@ -11,12 +11,12 @@
         class="go-back-button"
         @click="goBack"
       >
-        <i class="button-icon icon-left-open" />
+        <FAIcon size="lg" icon="chevron-left" />
       </a>
     </div>
     <div class="input-wrap">
       <div class="input-search">
-        <i class="button-icon icon-search" />
+        <FAIcon size="lg" class="search-icon button-icon" icon="search" />
       </div>
       <input
         ref="search"