From b6850fd5cf00c155b3831e1f4bcc11e66468d23d Mon Sep 17 00:00:00 2001
From: motechFR <mo@anyahq.co>
Date: Thu, 5 Dec 2024 15:45:46 +0100
Subject: [PATCH] Fix builders carousel and UI

---
 .../scout/StarterPackCarousel/StarterPackCarousel.tsx      | 2 +-
 .../scout/TodaysHotBuildersCarousel/BuildersCarousel.tsx   | 6 +++++-
 .../TodaysHotBuildersCarousel.tsx                          | 7 ++++++-
 3 files changed, 12 insertions(+), 3 deletions(-)

diff --git a/packages/scoutgame-ui/src/components/scout/StarterPackCarousel/StarterPackCarousel.tsx b/packages/scoutgame-ui/src/components/scout/StarterPackCarousel/StarterPackCarousel.tsx
index ea7e825548..52e987dcb1 100644
--- a/packages/scoutgame-ui/src/components/scout/StarterPackCarousel/StarterPackCarousel.tsx
+++ b/packages/scoutgame-ui/src/components/scout/StarterPackCarousel/StarterPackCarousel.tsx
@@ -22,7 +22,7 @@ export function StarterPackCarousel({
       <Carousel
         slidesPerView={1}
         autoplay={false}
-        boxProps={{ width: { xs: '100%', md: '80%' }, margin: '0 auto' }}
+        boxProps={{ width: { xs: '100%', md: '90%' }, margin: '0 auto' }}
         navigation={{
           nextEl: '.swiper-starter-pack-button-next',
           prevEl: '.swiper-starter-pack-button-prev'
diff --git a/packages/scoutgame-ui/src/components/scout/TodaysHotBuildersCarousel/BuildersCarousel.tsx b/packages/scoutgame-ui/src/components/scout/TodaysHotBuildersCarousel/BuildersCarousel.tsx
index 74e3e379ca..70b46121a4 100644
--- a/packages/scoutgame-ui/src/components/scout/TodaysHotBuildersCarousel/BuildersCarousel.tsx
+++ b/packages/scoutgame-ui/src/components/scout/TodaysHotBuildersCarousel/BuildersCarousel.tsx
@@ -80,5 +80,9 @@ export function BuildersCarousel({
         <BuilderCard size={size} key={builder.id} builder={builder} showPurchaseButton showHotIcon />
       ));
 
-  return <Carousel slidesPerView={slidesPerView}>{builderCards}</Carousel>;
+  return (
+    <Carousel slidesPerView={slidesPerView} boxProps={{ width: { xs: '100%', md: '90%' }, margin: '0 auto' }}>
+      {builderCards}
+    </Carousel>
+  );
 }
diff --git a/packages/scoutgame-ui/src/components/scout/TodaysHotBuildersCarousel/TodaysHotBuildersCarousel.tsx b/packages/scoutgame-ui/src/components/scout/TodaysHotBuildersCarousel/TodaysHotBuildersCarousel.tsx
index cefaca41c1..1f572dfb30 100644
--- a/packages/scoutgame-ui/src/components/scout/TodaysHotBuildersCarousel/TodaysHotBuildersCarousel.tsx
+++ b/packages/scoutgame-ui/src/components/scout/TodaysHotBuildersCarousel/TodaysHotBuildersCarousel.tsx
@@ -1,5 +1,6 @@
 import 'server-only';
 
+import { Box } from '@mui/material';
 import { getTodaysHotBuilders } from '@packages/scoutgame/builders/getTodaysHotBuilders';
 import { safeAwaitSSRData } from '@packages/scoutgame/utils/async';
 
@@ -13,5 +14,9 @@ export async function TodaysHotBuildersCarousel({ showPromoCards = false }: { sh
     return <ErrorSSRMessage />;
   }
 
-  return <BuildersCarousel builders={builders} showPromoCards={showPromoCards} />;
+  return (
+    <Box>
+      <BuildersCarousel builders={builders} showPromoCards={showPromoCards} />
+    </Box>
+  );
 }