From a2f790022591867b5ba8f69e6f434ad400820a10 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Andr=C3=A9s=20Gonz=C3=A1lez=20Mu=C3=B1oz?=
 <andres.gonzalez@vizzuality.com>
Date: Thu, 16 Nov 2023 19:07:33 +0100
Subject: [PATCH] fixes overflow content in gap-analysis list

---
 app/components/gap-analysis/item/component.tsx                | 2 +-
 .../sidebar/scenario/grid-setup/gap-analysis/index.tsx        | 2 +-
 .../sidebar/scenario/grid-setup/gap-analysis/list/index.tsx   | 4 ++--
 3 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/app/components/gap-analysis/item/component.tsx b/app/components/gap-analysis/item/component.tsx
index c674d51f4f..c53f21b6b9 100644
--- a/app/components/gap-analysis/item/component.tsx
+++ b/app/components/gap-analysis/item/component.tsx
@@ -87,7 +87,7 @@ export const Item: React.FC<ItemProps> = ({
           delay={[400, null]}
           offset={[-10, -34]}
         >
-          <div className=" overflow-hidden overflow-ellipsis whitespace-nowrap pt-1 font-heading text-sm">
+          <div className="overflow-hidden overflow-ellipsis whitespace-nowrap pt-1 font-heading text-sm">
             {name}
           </div>
         </Tooltip>
diff --git a/app/layout/project/sidebar/scenario/grid-setup/gap-analysis/index.tsx b/app/layout/project/sidebar/scenario/grid-setup/gap-analysis/index.tsx
index d6da96cf63..fb8f9e2198 100644
--- a/app/layout/project/sidebar/scenario/grid-setup/gap-analysis/index.tsx
+++ b/app/layout/project/sidebar/scenario/grid-setup/gap-analysis/index.tsx
@@ -61,7 +61,7 @@ export const GridSetupGAPAnalysis = (): JSX.Element => {
         <Toolbar search={search} onSearch={onSearch} />
 
         <div className="relative flex h-full flex-col overflow-hidden before:pointer-events-none before:absolute before:left-0 before:top-0 before:z-10 before:h-6 before:w-full before:bg-gradient-to-b before:from-gray-800 before:via-gray-800 after:pointer-events-none after:absolute after:bottom-0 after:left-0 after:z-10 after:h-6 after:w-full after:bg-gradient-to-t after:from-gray-800 after:via-gray-800">
-          <ScrollArea className="h-full pr-3">
+          <ScrollArea className="h-full">
             <List search={search} />
           </ScrollArea>
         </div>
diff --git a/app/layout/project/sidebar/scenario/grid-setup/gap-analysis/list/index.tsx b/app/layout/project/sidebar/scenario/grid-setup/gap-analysis/list/index.tsx
index c9dc3001c8..01b7c98c26 100644
--- a/app/layout/project/sidebar/scenario/grid-setup/gap-analysis/list/index.tsx
+++ b/app/layout/project/sidebar/scenario/grid-setup/gap-analysis/list/index.tsx
@@ -77,9 +77,8 @@ export const ScenariosPreGapAnalysisList = ({ search }: { search?: string }) =>
   }, []);
 
   return (
-    <div className="relative flex flex-grow flex-col">
+    <div className="relative">
       <div className="absolute -top-1 left-0 z-10 h-6 w-full bg-gradient-to-b from-gray-800 via-gray-800" />
-
       <div
         className={cn({
           'divide-y divide-dashed divide-black divide-opacity-20 bg-gray-800': true,
@@ -112,6 +111,7 @@ export const ScenariosPreGapAnalysisList = ({ search }: { search?: string }) =>
                     {...item}
                     highlighted={isHighlighted(item.id)}
                     onHighlight={() => toggleHighlight(item.id)}
+                    className="w-full"
                   />
                 </li>
               );