chore: portal and swiper position issue

pancakeswap · Nov 4, 2024 · b125161 · b125161
1 parent 28bd178
commit b125161
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 11 deletions.
diff --git a/apps/web/src/components/AdPanel/CardLayouts.tsx b/apps/web/src/components/AdPanel/CardLayouts.tsx
@@ -14,13 +14,6 @@ const FloatingContainer = styled(Box)`
   height: 100vh;
 `
 
-const Wrapper = styled.div`
-  position: absolute;
-  bottom: 30px;
-  right: 30px;
-  width: 100%;
-`
-
 const MobileContainer = styled(Box)`
   border: 1px solid red;
   width: 100%;
@@ -60,9 +53,7 @@ export const DesktopCard = () => {
   return portalRoot && isDesktop
     ? createPortal(
         <FloatingContainer>
-          <Wrapper>
-            <AdSlides />
-          </Wrapper>
+          <AdSlides />
         </FloatingContainer>,
         portalRoot,
       )

diff --git a/apps/web/src/components/AdPanel/CarrouselWithSlider.tsx b/apps/web/src/components/AdPanel/CarrouselWithSlider.tsx
@@ -6,10 +6,14 @@ import 'swiper/css/pagination'
 import { Swiper } from 'swiper/react'
 
 export const StyledSwiper = styled(Swiper)`
-  position: relative;
+  position: absolute;
+  right: 30px;
+  bottom: 30px;
   overflow: visible;
   opacity: 0;
   animation: ${appearAnimation} 0.3s ease-in-out 0.7s forwards;
+  width: 328px;
+  margin: 0;
   .swiper-pagination {
     position: absolute;
     left: 50%;