From b9850857864af17f58f8f84abda11722b0cbd218 Mon Sep 17 00:00:00 2001
From: Pranav Raj Sreepuram <pranavrajs@gmail.com>
Date: Tue, 12 Nov 2019 10:09:24 +0530
Subject: [PATCH] Fix styles in conversation view

---
 .../widget/components/ConversationWrap.vue    | 32 +++++++++++++++----
 app/javascript/widget/views/Home.vue          |  6 ----
 2 files changed, 25 insertions(+), 13 deletions(-)

diff --git a/app/javascript/widget/components/ConversationWrap.vue b/app/javascript/widget/components/ConversationWrap.vue
index 5ffd0f139..faaa761da 100755
--- a/app/javascript/widget/components/ConversationWrap.vue
+++ b/app/javascript/widget/components/ConversationWrap.vue
@@ -1,12 +1,14 @@
 <template>
-  <section class="conversation-wrap">
-    <ChatMessage
-      v-for="message in messages"
-      :key="message.id"
-      :message="message"
-    />
+  <div class="conversation--container">
+    <div class="conversation-wrap">
+      <ChatMessage
+        v-for="message in messages"
+        :key="message.id"
+        :message="message"
+      />
+    </div>
     <branding></branding>
-  </section>
+  </div>
 </template>
 
 <script>
@@ -39,3 +41,19 @@ export default {
   },
 };
 </script>
+
+<style scoped lang="scss">
+@import '~widget/assets/scss/woot.scss';
+
+.conversation--container {
+  display: flex;
+  flex-direction: column;
+  flex: 1;
+  overflow-y: auto;
+}
+
+.conversation-wrap {
+  flex: 1;
+  padding: $space-large $space-small $zero $space-small;
+}
+</style>
diff --git a/app/javascript/widget/views/Home.vue b/app/javascript/widget/views/Home.vue
index 097f95aef..59182c4b9 100755
--- a/app/javascript/widget/views/Home.vue
+++ b/app/javascript/widget/views/Home.vue
@@ -53,12 +53,6 @@ export default {
     flex-shrink: 0;
   }
 
-  .conversation-wrap {
-    flex: 1;
-    overflow-y: auto;
-    padding: $space-large $space-small $zero $space-small;
-  }
-
   .footer-wrap {
     flex-shrink: 0;
   }