fix: modal overflow

Goncalo-Marques · Jun 11, 2024 · 2311ed0 · 2311ed0
1 parent fc4e98d
commit 2311ed0
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 3 deletions.
diff --git a/web/src/lib/components/SelectLocation.svelte b/web/src/lib/components/SelectLocation.svelte
@@ -259,7 +259,14 @@
 	onBackdropClick={removeSelectedLocation}
 	title={$t("selectLocation")}
 >
-	<Map bind:map mapId="select-location-map" --height="32rem" --width="60rem" />
+	<Map
+		bind:map
+		mapId="select-location-map"
+		--height="50vh"
+		--width="60vw"
+		--max-height="32rem"
+		--max-width="60rem"
+	/>
 	<svelte:fragment slot="actions">
 		<Button variant="tertiary" onClick={handleCancel}>{$t("cancel")}</Button>
 		<Button

diff --git a/web/src/lib/components/map/Map.svelte b/web/src/lib/components/map/Map.svelte
@@ -138,6 +138,8 @@
 	.map {
 		width: var(--width, 100%);
 		height: var(--height, 100%);
+		max-width: var(--max-width, 100%);
+		max-height: var(--max-height, 100%);
 		position: relative;
 	}
 

diff --git a/web/src/routes/backOffice/routes/components/SelectContainers.svelte b/web/src/routes/backOffice/routes/components/SelectContainers.svelte
@@ -329,8 +329,10 @@
 	<MapComponent
 		bind:map
 		mapId="select-containers-map"
-		--height="32rem"
-		--width="60rem"
+		--height="50vh"
+		--width="60vw"
+		--max-height="32rem"
+		--max-width="60rem"
 	/>
 	<svelte:fragment slot="actions">
 		<Button variant="tertiary" onClick={handleCancel}>{$t("cancel")}</Button>