From 9d9f151f2ff48c2dd346105afb74a0a2f54288e7 Mon Sep 17 00:00:00 2001
From: tarunsinghofficial <tarunsinghwap7@gmail.com>
Date: Mon, 2 Sep 2024 13:54:45 +0530
Subject: [PATCH] style: search-pane to have lower z-index than stop modal

---
 src/components/navigation/ModalPane.svelte | 5 ++++-
 src/routes/+page.svelte                    | 2 +-
 2 files changed, 5 insertions(+), 2 deletions(-)

diff --git a/src/components/navigation/ModalPane.svelte b/src/components/navigation/ModalPane.svelte
index e544ec5..2934016 100644
--- a/src/components/navigation/ModalPane.svelte
+++ b/src/components/navigation/ModalPane.svelte
@@ -6,6 +6,8 @@
 	import { createEventDispatcher } from 'svelte';
 	import { pushState } from '$app/navigation';
 
+	export let stop = null;
+
 	const dispatch = createEventDispatcher();
 
 	function closePane() {
@@ -16,6 +18,7 @@
 
 <div
 	class="modal-pane scroll-hidden"
+	style={stop ? 'z-index: 40' : 'z-index: 20'}
 	in:fly={{ y: 200, duration: 500 }}
 	out:fly={{ y: 200, duration: 500 }}
 >
@@ -36,7 +39,7 @@
 
 <style lang="postcss">
 	.modal-pane {
-		@apply absolute bottom-0 left-0 z-40 max-h-[40rem] w-full overflow-y-scroll bg-transparent px-2 shadow-lg md:max-w-prose;
+		@apply absolute bottom-0 left-0 max-h-[40rem] w-full overflow-y-scroll bg-transparent px-2 shadow-lg md:max-w-prose;
 		@apply rounded-lg border-b-[1px] border-[#C6C6C8] bg-[#F3F2F8] dark:border-[1px] dark:border-[#C6C6C8] dark:border-opacity-15 dark:bg-black;
 	}
 
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index b27df14..a21d50c 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -69,7 +69,7 @@
 <Header on:searchResults={handleSearch} />
 
 {#if stop}
-	<ModalPane on:close={closePane}>
+	<ModalPane on:close={closePane} {stop}>
 		<StopPane
 			{showAllStops}
 			{stop}