From 4c65b4ce30f45f943fbc79a1549c93e0ef79739b Mon Sep 17 00:00:00 2001
From: Baptiste Arnaud <contact@baptiste-arnaud.fr>
Date: Mon, 7 Mar 2022 15:10:33 +0100
Subject: [PATCH] =?UTF-8?q?fix(theme):=20=F0=9F=90=9B=20Force=20display=20?=
 =?UTF-8?q?block=20on=20lite=20badge?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/bot-engine/src/assets/importantStyles.css   | 3 +++
 packages/bot-engine/src/components/TypebotViewer.tsx | 5 ++++-
 2 files changed, 7 insertions(+), 1 deletion(-)
 create mode 100644 packages/bot-engine/src/assets/importantStyles.css

diff --git a/packages/bot-engine/src/assets/importantStyles.css b/packages/bot-engine/src/assets/importantStyles.css
new file mode 100644
index 000000000..f4fd45723
--- /dev/null
+++ b/packages/bot-engine/src/assets/importantStyles.css
@@ -0,0 +1,3 @@
+.lite-badge {
+  display: block !important;
+}
diff --git a/packages/bot-engine/src/components/TypebotViewer.tsx b/packages/bot-engine/src/components/TypebotViewer.tsx
index 52f5f515c..10b892a6d 100644
--- a/packages/bot-engine/src/components/TypebotViewer.tsx
+++ b/packages/bot-engine/src/components/TypebotViewer.tsx
@@ -7,6 +7,8 @@ import style from '../assets/style.css'
 //@ts-ignore
 import phoneNumberInputStyle from 'react-phone-number-input/style.css'
 //@ts-ignore
+import importantStyles from '../assets/importantStyles.css'
+//@ts-ignore
 import phoneSyle from '../assets/phone.css'
 import { ConversationContainer } from './ConversationContainer'
 import { AnswersContext } from '../contexts/AnswersContext'
@@ -67,6 +69,7 @@ export const TypebotViewer = ({
           {phoneSyle}
           {style}
           {typebot.theme?.customCss}
+          {importantStyles}
         </style>
       }
       name="Typebot viewer"
@@ -107,7 +110,7 @@ export const TypebotViewer = ({
                 href={'https://www.typebot.io/?utm_source=litebadge'}
                 target="_blank"
                 rel="noopener noreferrer"
-                className="fixed py-1 px-2 bg-white z-50 rounded shadow-md"
+                className="fixed py-1 px-2 bg-white z-50 rounded shadow-md lite-badge"
                 style={{ bottom: '20px' }}
               >
                 Made with <span className="text-blue-500">Typebot</span>.