From e980c8693a8cb54eb88f547985a5ab7859cf17df Mon Sep 17 00:00:00 2001
From: Nithin David <1277421+nithindavid@users.noreply.github.com>
Date: Fri, 1 Oct 2021 15:10:32 +0530
Subject: [PATCH] Style fixes

---
 app/javascript/widget/components/ConversationItem.vue | 10 +++++-----
 app/javascript/widget/views/Conversations.vue         |  6 ++++--
 2 files changed, 9 insertions(+), 7 deletions(-)

diff --git a/app/javascript/widget/components/ConversationItem.vue b/app/javascript/widget/components/ConversationItem.vue
index 0ae16ec6b..df498b7fd 100644
--- a/app/javascript/widget/components/ConversationItem.vue
+++ b/app/javascript/widget/components/ConversationItem.vue
@@ -1,17 +1,17 @@
 <template>
   <div class="item--wrap">
     <button @click="onItemClick">
-      <div class="flex items-center space-x-4">
+      <div class="flex items-center space-x-2">
         <div class="h-10 w-10 rounded-full border-2 border-woot-100">
           <thumbnail
-            src="https://images.unsplash.com/photo-1519345182560-3f2917c472ef?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80"
+            src="https://randomuser.me/api/portraits/women/11.jpg"
             size="40px"
             username="Erin Lindford"
           />
         </div>
-        <div class="ml-2 text-left">
-          <p class="text-sm font-medium text-gray-900">Nithin David</p>
-          <p class="text-sm text-gray-500">
+        <div class="text-left">
+          <p class="text-sm font-medium text-black-900">Nithin David</p>
+          <p class="text-sm text-black-500">
             {{ lastMessageContent }}
           </p>
         </div>
diff --git a/app/javascript/widget/views/Conversations.vue b/app/javascript/widget/views/Conversations.vue
index 18db9130e..c8511b14f 100644
--- a/app/javascript/widget/views/Conversations.vue
+++ b/app/javascript/widget/views/Conversations.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="home">
     <div class="p-4">
-      <div class="flex items-center mt-2">
+      <div class="flex items-center my-2">
         <button
           type="button"
           class="inline-flex items-center px-2 py-2 border-transparent text-sm leading-4 font-medium rounded-md text-black-900 hover:bg-black-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-woot-200"
@@ -20,7 +20,9 @@
             />
           </svg>
         </button>
-        <h1 class="text-xl font-semibold ml-1">All conversations</h1>
+        <h1 class="text-xl font-medium ml-1 text-black-900">
+          All conversations
+        </h1>
       </div>
       <conversation-list :conversations="allConversations" />
     </div>