From 2d715d381cc8f47af0908691a1e5ca2f59da9877 Mon Sep 17 00:00:00 2001
From: David Beguin <dbe@odoo.com>
Date: Fri, 4 Sep 2020 13:15:31 +0000
Subject: [PATCH] [FIX] im_livechat: apply internal livechat window style to
 external livechat window

This commit applies missing style rules to external livechat window
in order to make it look like the internal version of the livechat window.

Task ID-2301261
PR odoo/odoo#60549

X-original-commit: da1d2ca0c593e6179b166f94f2e280445e059da7
---
 .../static/src/legacy/public_livechat.scss    | 46 ++++++++++++++++++-
 .../static/src/legacy/public_livechat.xml     |  2 +-
 .../src/scss/im_livechat_bootstrap.scss       | 12 ++++-
 3 files changed, 55 insertions(+), 5 deletions(-)

diff --git a/addons/im_livechat/static/src/legacy/public_livechat.scss b/addons/im_livechat/static/src/legacy/public_livechat.scss
index 856889feb66..3710e11be8d 100644
--- a/addons/im_livechat/static/src/legacy/public_livechat.scss
+++ b/addons/im_livechat/static/src/legacy/public_livechat.scss
@@ -98,7 +98,7 @@ $o-mail-thread-window-zindex: $zindex-modal + 1 !default;
             flex: 0 0 auto;
             .o_thread_window_close, .o_thread_window_expand {
                 color: white;
-                padding: 3px;
+                padding: 0px 3px;
                 margin-left: 5px;
                 @include o-hover-opacity(0.7, 1);
             }
@@ -570,6 +570,20 @@ $o-mail-thread-window-zindex: $zindex-modal + 1 !default;
         display: none;
     }
 
+    .btn {
+        color: #FFFFFF;
+        background-color: #30908e;
+        border-color: #2d8685;
+        border: 1px solid transparent;
+    }
+
+    .btn-sm {
+        padding: 0.0625rem 0.3125rem;
+        font-size: 0.75rem;
+        line-height: 1.5;
+        border-radius: 0.2rem;
+    }
+
     .o_livechat_rating {
         /* Livechat Rating : feedback smiley */
         flex: 1 1 auto;
@@ -580,7 +594,31 @@ $o-mail-thread-window-zindex: $zindex-modal + 1 !default;
         .o_livechat_email {
             font-size: 12px;
             > div {
+                display: flex;
                 padding: 5px 0;
+                input {
+                    display: block;
+                    width: 100%;
+                    height: calc(1.5em + 0.75rem + 2px);
+                    padding: 0.375rem 0.75rem;
+                    font-size: 0.875rem;
+                    font-weight: 400;
+                    line-height: 1.5;
+                    color: #495057;
+                    background-color: #FFFFFF;
+                    background-clip: padding-box;
+                    border: 1px solid #CED4DA;
+                }
+                button {
+                    display: inline-block;
+                    font-weight: 400;
+                    text-align: center;
+                    vertical-align: middle;
+                    user-select: none;
+                    padding: 0.375rem 0.75rem;
+                    font-size: 0.875rem;
+                    line-height: 1.5;
+                }
             }
         }
 
@@ -610,7 +648,7 @@ $o-mail-thread-window-zindex: $zindex-modal + 1 !default;
 
         /* feedback reason */
         .o_livechat_rating_reason {
-            margin: 10px 0;
+            margin: 10px 0px 25px 0px;
             display: none; /* hidden by default */
 
             > textarea {
@@ -624,6 +662,10 @@ $o-mail-thread-window-zindex: $zindex-modal + 1 !default;
             float: right;
         }
     }
+
+    .o_composer_text_field {
+        line-height: 1.3em;
+    }
 }
 
 .o_livechat_operator_avatar {
diff --git a/addons/im_livechat/static/src/legacy/public_livechat.xml b/addons/im_livechat/static/src/legacy/public_livechat.xml
index e582fea12e9..821edc30cfb 100644
--- a/addons/im_livechat/static/src/legacy/public_livechat.xml
+++ b/addons/im_livechat/static/src/legacy/public_livechat.xml
@@ -16,7 +16,7 @@
             </div>
             <div class="o_livechat_rating_reason">
                 <textarea id="reason" placeholder="Explain your note"></textarea>
-                <div class="o_livechat_rating_reason_button pb-3">
+                <div class="o_livechat_rating_reason_button">
                     <input type="button" class="btn btn-primary btn-sm o_rating_submit_button" value="Send" />
                 </div>
             </div>
diff --git a/addons/im_livechat/static/src/scss/im_livechat_bootstrap.scss b/addons/im_livechat/static/src/scss/im_livechat_bootstrap.scss
index f01d7259805..dddf5baa73f 100644
--- a/addons/im_livechat/static/src/scss/im_livechat_bootstrap.scss
+++ b/addons/im_livechat/static/src/scss/im_livechat_bootstrap.scss
@@ -1,8 +1,11 @@
-
 .text-muted {
   color: gray('600');
 }
 
+.text-left {
+  text-align: left;
+}
+
 .text-center {
   text-align: center;
 }
@@ -17,11 +20,16 @@
       text-decoration: none;
       font-weight: bold;
       &:before {
-        content: "X";
+        content: "\00d7";
+        font-size: initial;
       }
     }
     > span {
       margin: auto 0;
     }
   }
+
+  .o_email_chat_button:after {
+    content:' \27A4';
+  }
 }