fixing overlapping spacing issue

taver-ca · May 11, 2024 · 31dd28e · 31dd28e
1 parent d3ce632
commit 31dd28e
Show file tree

Hide file tree

Showing 3 changed files with 4 additions and 4 deletions.
diff --git a/src/App.js b/src/App.js
@@ -66,10 +66,10 @@ function App() {
       <Grid
         className="App-header"
         container
-        spacing={2}
+        columnSpacing={{ xs: 1, sm: 2, md: 3, lg: 10, xl: 3 }}
         alignItems="flex-start"
       >
-        <Grid direction={"column"} xs={10} sm={10} md={10} lg={2} xl={2} spacing={2}>
+        <Grid direction={"column"} xs={10} sm={10} md={10} lg={2} xl={2}>
           <Box>
             <img src={window.location.origin + "/Taver.png"} alt="Taver" />
           </Box>

diff --git a/src/SharePage.js b/src/SharePage.js
@@ -16,7 +16,7 @@ const SharePage = ({ concerts, userLocation, mapStyle, setPosterName }) => {
 
 
     return (
-        <Stack disablePadding>
+        <Stack disablePadding spacing={3}>
             {isLoaded ? <Map concerts={concerts} userLocation={userLocation} mapStyle={mapStyle} /> : null}
             <TextField
                 variant="standard"

diff --git a/src/map.js b/src/map.js
@@ -150,7 +150,7 @@ function Map({ concerts, userLocation, mapStyle }) {
         maxZoom: 20,
         disableDefaultUI: true
       }}
-      mapContainerStyle={(width / height) >= 1 ? { width: "100wh", height: "50vh" } : { width: "100wh", height: "75vh" }}
+      mapContainerStyle={(width / height) >= 1 ? { width: "100wh", height: "75vh" } : { width: "100wh", height: "75vh" }}
     >
       {userLocation && (
         <MarkerF