Add NearestStations Card & Location monitor

src/lib/components/ui/cards/pis/PisCode.svelte

@@ -1,28 +1,34 @@
 <script lang="ts">
-import BaseCard from '$lib/components/ui/cards/BaseCard.svelte';
-import Textbox from '$lib/components/ui/Textbox.svelte';
-import Button from '$lib/components/ui/Button.svelte';
+	import BaseCard from '$lib/components/ui/cards/BaseCard.svelte';
+	import Textbox from '$lib/components/ui/Textbox.svelte';
+	import Button from '$lib/components/ui/Button.svelte';
 
-let { onsearch }: { onsearch: (c: string) => void } = $props();
+	let { onsearch }: { onsearch: (c: string) => void } = $props();
 
-let codeValue = $state('');
+	let codeValue = $state('');
 
-function resetValues(): void {
-    codeValue = '';
-}
+	function resetValues(): void {
+		codeValue = '';
+	}
 </script>
 
 <BaseCard header={'Find by Code'}>
 	<div class="card-content">
-        <div class="textbox-container">
-            <div class="textbox-item-wrapper">
-                <Textbox placeholder={"Code"} uppercase={true} type={'number'} max={9999} bind:value={codeValue} />
-            </div>
-        </div>
-        <div class="button-wrapper">
-            <Button onclick={() => onsearch(codeValue.toString())}>Search</Button>
-            <Button onclick={resetValues}>Reset</Button>
-        </div>
+		<div class="textbox-container">
+			<div class="textbox-item-wrapper">
+				<Textbox
+					placeholder={'Code'}
+					uppercase={true}
+					type={'number'}
+					max={9999}
+					bind:value={codeValue}
+				/>
+			</div>
+		</div>
+		<div class="button-wrapper">
+			<Button onclick={() => onsearch(codeValue.toString())}>Search</Button>
+			<Button onclick={resetValues}>Reset</Button>
+		</div>
 	</div>
 </BaseCard>
 
@@ -34,21 +40,21 @@ function resetValues(): void {
 		padding: 10px 0 10px 0;
 	}
 
-    .textbox-container {
-        display: flex;
-        width: 100%;
-        justify-content: center;
-        gap: 4rem;
-    }
+	.textbox-container {
+		display: flex;
+		width: 100%;
+		justify-content: center;
+		gap: 4rem;
+	}
 
-    .textbox-item-wrapper {
-        width: 30%;
-    }
+	.textbox-item-wrapper {
+		width: 30%;
+	}
 
-    .button-wrapper {
-        display: flex;
-        justify-content: center;
-        gap: 1rem;
-        margin-top: 15px;
-    }
-</style>
+	.button-wrapper {
+		display: flex;
+		justify-content: center;
+		gap: 1rem;
+		margin-top: 15px;
+	}
+</style>