From fe3f334fec93e1410f66098f9905e3ec7b920fb1 Mon Sep 17 00:00:00 2001
From: ronronscelestes <julie.plantey@gmail.com>
Date: Tue, 2 Nov 2021 14:40:33 +0100
Subject: [PATCH] fixed overflow bug with accordions in CM

---
 .../DynamicZone/components/Component/index.js   | 17 +++++++++--------
 .../RepeatableComponent/DraggedItem/index.js    |  5 +++--
 2 files changed, 12 insertions(+), 10 deletions(-)

diff --git a/packages/core/admin/admin/src/content-manager/components/DynamicZone/components/Component/index.js b/packages/core/admin/admin/src/content-manager/components/DynamicZone/components/Component/index.js
index fd871f7539..81c29361d1 100644
--- a/packages/core/admin/admin/src/content-manager/components/DynamicZone/components/Component/index.js
+++ b/packages/core/admin/admin/src/content-manager/components/DynamicZone/components/Component/index.js
@@ -17,17 +17,18 @@ import { getTrad } from '../../../../utils';
 import FieldComponent from '../../../FieldComponent';
 import Rectangle from './Rectangle';
 
-// FIXME: needed for the react-select overflow
-const StyledBox = styled(Box)`
-  > div {
-    overflow: visible;
-  }
-`;
-
 const IconButtonCustom = styled(IconButton)`
   background-color: transparent;
 `;
 
+const StyledBox = styled(Box)`
+  > div {
+    > div:not(:first-of-type) {
+      overflow: visible;
+    }
+  }
+`;
+
 const Component = ({
   componentUid,
   index,
@@ -76,7 +77,7 @@ const Component = ({
   return (
     <Box>
       <Rectangle />
-      <StyledBox shadow="tableShadow">
+      <StyledBox shadow="tableShadow" hasRadius>
         <Accordion expanded={isOpen} toggle={() => onToggle(index)} size="S">
           <AccordionToggle
             startIcon={<FontAwesomeIcon icon={icon} />}
diff --git a/packages/core/admin/admin/src/content-manager/components/RepeatableComponent/DraggedItem/index.js b/packages/core/admin/admin/src/content-manager/components/RepeatableComponent/DraggedItem/index.js
index 260caac826..bffc572bb6 100644
--- a/packages/core/admin/admin/src/content-manager/components/RepeatableComponent/DraggedItem/index.js
+++ b/packages/core/admin/admin/src/content-manager/components/RepeatableComponent/DraggedItem/index.js
@@ -21,10 +21,11 @@ import DraggingSibling from './DraggingSibling';
 import { CustomIconButton, DragHandleWrapper } from './IconButtonCustoms';
 import { connect, select } from './utils';
 
-// FIXME: needed for the react-select overflow
 const StyledBox = styled(Box)`
   > div {
-    overflow: visible;
+    > div:not(:first-of-type) {
+      overflow: visible;
+    }
   }
 `;