From 148b64deaf8c90fedfeb8a8913932097e5e26263 Mon Sep 17 00:00:00 2001
From: Baptiste Arnaud <baptiste.arnaud95@gmail.com>
Date: Fri, 25 Apr 2025 15:11:49 +0200
Subject: [PATCH] =?UTF-8?q?=F0=9F=90=9B=20Fix=20TypebotHeader=20overlappin?=
 =?UTF-8?q?g=20blocks=20settings=20window?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Closes #2134
---
 .../analytics/components/AnalyticsGraphContainer.tsx         | 2 ++
 apps/builder/src/features/editor/components/EditorPage.tsx   | 1 +
 .../builder/src/features/editor/components/TypebotHeader.tsx | 1 -
 apps/builder/src/features/results/components/ResultsPage.tsx | 5 +----
 4 files changed, 4 insertions(+), 5 deletions(-)

diff --git a/apps/builder/src/features/analytics/components/AnalyticsGraphContainer.tsx b/apps/builder/src/features/analytics/components/AnalyticsGraphContainer.tsx
index 43f5e3f76..7bf33ac07 100644
--- a/apps/builder/src/features/analytics/components/AnalyticsGraphContainer.tsx
+++ b/apps/builder/src/features/analytics/components/AnalyticsGraphContainer.tsx
@@ -89,6 +89,7 @@ export const AnalyticsGraphContainer = ({
     <Flex
       w="full"
       pos="relative"
+      overflow="clip"
       bgColor={useColorModeValue("#f4f5f8", "gray.900")}
       backgroundImage={useColorModeValue(
         "radial-gradient(#c6d0e1 1px, transparent 0)",
@@ -128,6 +129,7 @@ export const AnalyticsGraphContainer = ({
       <StatsCards
         stats={stats}
         pos="absolute"
+        top="1rem"
         timeFilter={timeFilter}
         onTimeFilterChange={onTimeFilterChange}
       />
diff --git a/apps/builder/src/features/editor/components/EditorPage.tsx b/apps/builder/src/features/editor/components/EditorPage.tsx
index d2404def4..c8a27e345 100644
--- a/apps/builder/src/features/editor/components/EditorPage.tsx
+++ b/apps/builder/src/features/editor/components/EditorPage.tsx
@@ -39,6 +39,7 @@ export const EditorPage = () => {
         <Flex
           flex="1"
           pos="relative"
+          overflow="clip"
           h="full"
           bgColor={bgColor}
           backgroundImage={backgroundImage}
diff --git a/apps/builder/src/features/editor/components/TypebotHeader.tsx b/apps/builder/src/features/editor/components/TypebotHeader.tsx
index f7dc6698e..77fcf38c5 100644
--- a/apps/builder/src/features/editor/components/TypebotHeader.tsx
+++ b/apps/builder/src/features/editor/components/TypebotHeader.tsx
@@ -60,7 +60,6 @@ export const TypebotHeader = () => {
       justify="center"
       align="center"
       h={`${headerHeight}px`}
-      zIndex={1}
       pos="relative"
       bgColor={headerBgColor}
       flexShrink={0}
diff --git a/apps/builder/src/features/results/components/ResultsPage.tsx b/apps/builder/src/features/results/components/ResultsPage.tsx
index fbacaf536..74b398cf2 100644
--- a/apps/builder/src/features/results/components/ResultsPage.tsx
+++ b/apps/builder/src/features/results/components/ResultsPage.tsx
@@ -35,10 +35,7 @@ export const ResultsPage = () => {
     () => router.pathname.endsWith("analytics"),
     [router.pathname],
   );
-  const bgColor = useColorModeValue(
-    router.pathname.endsWith("analytics") ? "#f4f5f8" : "white",
-    router.pathname.endsWith("analytics") ? "gray.900" : "gray.950",
-  );
+  const bgColor = useColorModeValue("white", "gray.950");
   const [timeFilter, setTimeFilter] = useQueryState<
     (typeof timeFilterValues)[number]
   >("timeFilter", {