map made responsive

Gaurav-Verma07 · May 23, 2023 · 8933f43 · 8933f43
1 parent 3b33556
commit 8933f43
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 8 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/src/components/MainBlogs/MainBlogs.tsx b/src/components/MainBlogs/MainBlogs.tsx
@@ -48,7 +48,11 @@ const MainBlogs = () => {
   ));
 
   return (
-    <Paper m={20} px={70} mb={70}>
+    <Paper m={20} px={70} mb={70}  
+      sx={{
+       paddingTop:"20px"
+      }}
+    >
       <Box>
         <Title
           order={3}

diff --git a/src/components/MapBox/MapBox.tsx b/src/components/MapBox/MapBox.tsx
@@ -74,15 +74,18 @@ const MapBox = () => {
     <Paper
       m={25}
       sx={{
-        height: '80vh',
+        height: '90vh',
         display: 'flex',
-        justifyContent: 'space-around',
-        alignItems: 'left',
+        direction:'row',
+        flexWrap:'wrap',
+        justifyContent: 'centre',
+        alignItems: 'center',
       }}
     >
       <Card
-        sx={{ display: 'flex', alignItems: 'left', flexDirection: 'column' }}
-        w="50%"
+        sx={{ display: 'flex', alignItems: 'left', flexDirection: 'column',minWidth:"360px",maxWidth:"50%" }}
+
+
       >
         <Title order={1} weight={300}>
           We provide assistanace. Register your NGO/orphanage at Sampark.
@@ -119,7 +122,7 @@ const MapBox = () => {
         }}
         style={{
           width: '500px',
-          height: '100%',
+          height: '60%',
           borderRight: '10px',
         }}
         mapStyle="mapbox://styles/mapbox/dark-v9"