From 2035d24cb834f47746ac166296283f7cb4d7e04a Mon Sep 17 00:00:00 2001
From: Nithin David Thomas <1277421+nithindavid@users.noreply.github.com>
Date: Sat, 7 Aug 2021 11:56:40 +0530
Subject: [PATCH] enhancement: Show close button for unread view (#2758)

* enhancement: Show close button for unread view

* Fixes issue with button spacing

Co-authored-by: Muhsin Keloth <muhsinkeramam@gmail.com>
---
 app/javascript/widget/views/Unread.vue | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/app/javascript/widget/views/Unread.vue b/app/javascript/widget/views/Unread.vue
index 7972d30f6..e45a4f2b4 100644
--- a/app/javascript/widget/views/Unread.vue
+++ b/app/javascript/widget/views/Unread.vue
@@ -6,7 +6,7 @@
         class="button small close-unread-button"
         @click="closeFullView"
       >
-        <i class="ion-close-round" />
+        <i class="ion-android-close" />
         {{ $t('UNREAD_VIEW.CLOSE_MESSAGES_BUTTON') }}
       </button>
     </div>
@@ -73,7 +73,7 @@ export default {
       campaign: 'campaign/getActiveCampaign',
     }),
     showCloseButton() {
-      return this.unreadMessageCount && this.hideMessageBubble;
+      return this.unreadMessageCount;
     },
     sender() {
       const [firstMessage] = this.unreadMessages;
@@ -154,10 +154,10 @@ export default {
 
   .close-unread-button {
     background: $color-background;
-    color: $color-gray;
+    color: $color-light-gray;
     border: 0;
-    font-weight: $font-weight-bold;
-    font-size: $font-size-small;
+    font-weight: $font-weight-medium;
+    font-size: $font-size-mini;
     transition: all 0.3s $ease-in-cubic;
     margin-bottom: $space-slab;
     border-radius: $space-normal;
@@ -178,7 +178,7 @@ export default {
 
 .unread-messages {
   width: 100%;
-  margin-top: auto;
+  margin-top: 0;
   padding-bottom: $space-small;
   display: flex;
   flex-direction: column;