More size for Product View

components/product/ProductSlider/ProductSlider.module.css

@@ -1,9 +1,14 @@
 .root {
   @apply relative w-full h-full;
+  overflow-y: hidden;
+
+  & > div {
+    overflow: visible !important;
+  }
 }
 
 .rootPanel {
-  @apply absolute flex flex-row inset-0 z-20 overflow-hidden;
+  @apply absolute flex flex-row inset-0 z-20 m-20;
 }
 
 .leftPanel {

components/product/ProductSlider/ProductSlider.tsx

@@ -19,13 +19,18 @@ const ProductSlider: FC<Props> = ({ children }) => {
 
   return (
     <div className={s.root}>
+      <SwipeableViews
+        index={idx}
+        onChangeIndex={setIdx}
+        containerStyle={{ overflow: 'visible' }}
+        slideStyle={{ overflow: 'visible' }}
+      >
+        {children}
+      </SwipeableViews>
       <div className={s.rootPanel}>
         <div className={s.leftPanel} onClick={goBack}></div>
         <div className={s.rightPanel} onClick={goNext}></div>
       </div>
-      <SwipeableViews index={idx} onChangeIndex={setIdx}>
-        {children}
-      </SwipeableViews>
     </div>
   )
 }