From f39ad1385bff42261e5dad226bae905d58ebb9ab Mon Sep 17 00:00:00 2001
From: Thomas Cherret <b00705488@essec.edu>
Date: Wed, 26 Jun 2024 11:18:47 +0200
Subject: [PATCH] feat: make cover image responsive

---
 .../SuperfestPage/SuperfestMisisonPage.tsx    | 27 ++++++++++---------
 1 file changed, 14 insertions(+), 13 deletions(-)

diff --git a/src/components/Superfest/SuperfestPage/SuperfestMisisonPage.tsx b/src/components/Superfest/SuperfestPage/SuperfestMisisonPage.tsx
index fc2a721e5..08101f8b4 100644
--- a/src/components/Superfest/SuperfestPage/SuperfestMisisonPage.tsx
+++ b/src/components/Superfest/SuperfestPage/SuperfestMisisonPage.tsx
@@ -96,19 +96,20 @@ export const SuperfestMissionPage = ({
         </Box>
         {/* big component with the main information */}
         <BannerMainBox>
-          <Image
-            src={`${new URL(
-              attributes.BannerImage?.data[0]?.attributes?.url,
-              baseUrl,
-            )}`}
-            alt="Banner Image"
-            height={316}
-            width={1300}
-            style={{
-              borderTopLeftRadius: '8px',
-              borderTopRightRadius: '8px',
-            }}
-          />
+          <Box sx={{ position: 'relative', width: '100%', height: '60%' }}>
+            <Image
+              src={`${new URL(
+                attributes.BannerImage?.data[0]?.attributes?.url,
+                baseUrl,
+              )}`}
+              fill
+              alt="Banner Image"
+              style={{
+                borderTopLeftRadius: '8px',
+                borderTopRightRadius: '8px',
+              }}
+            />
+          </Box>
           <BannerBottomBox>
             {/* date + chains */}
             <Box