From dcbbb09ebdeccf987f1474a60d3c0558aed3ba21 Mon Sep 17 00:00:00 2001
From: Brent <brentco@users.noreply.github.com>
Date: Sun, 19 Sep 2021 17:42:54 +0200
Subject: [PATCH] fix: Update widget option button style to handle long text
 (#3030)

Co-authored-by: Pranav Raj S <pranav@chatwoot.com>
---
 app/javascript/shared/components/ChatOption.vue | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/app/javascript/shared/components/ChatOption.vue b/app/javascript/shared/components/ChatOption.vue
index 74a614579..672939356 100644
--- a/app/javascript/shared/components/ChatOption.vue
+++ b/app/javascript/shared/components/ChatOption.vue
@@ -41,10 +41,11 @@ export default {
 @import '~widget/assets/scss/variables.scss';
 
 .option {
-  border: 1px solid $color-woot;
   border-radius: $space-jumbo;
+  border: 1px solid $color-woot;
   float: left;
   margin: $space-smaller;
+  max-width: 100%;
 
   .option-button {
     background: transparent;
@@ -52,7 +53,11 @@ export default {
     border: 0;
     color: $color-woot;
     cursor: pointer;
+    height: auto;
+    line-height: 1.5;
+    min-height: $space-two * 2;
     text-align: left;
+    white-space: normal;
 
     span {
       display: inline-block;