Update map render

frontend/src/lib/components/Tabs.svelte

@@ -41,7 +41,7 @@
 		<button id="desc">Descrizione</button>
 		<button id="map">Mappa</button>
 	</div>
-	<div class="tab" bind:this={ref}>
+	<div class="tab" bind:this={ref} role="tab">
 		<svelte:component this={component} route={route} />
 	</div>
 </div>

frontend/src/lib/components/tabs/MapTab.svelte

@@ -12,6 +12,9 @@
 	let longitude;
 	let accuracy;
 	const errorMessage = "Geolocation not available";
+	const attribution = '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors';
+	const openStreetMapTile = 'https://tile.openstreetmap.org/{z}/{x}/{y}.png';
+
 	let errored = false;
 
 	const watchPosition = async () => {
@@ -59,15 +62,11 @@
 		});
 
 		map.setView(pianelloCoordinates, 13);
-
 		map.setMaxBounds(map.getBounds());
 
 		leaflet
-			.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', {
-				attribution:
-					'&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
-			})
-		.addTo(map);
+			.tileLayer(openStreetMapTile, {attribution})
+			.addTo(map);
 	}
 
 	onMount(async () => {
@@ -83,10 +82,11 @@
 		}
 	});
 </script>
+
 {#if !errored}
-<div id="map" in:fade bind:this={mapElement} />
+	<div id="map" in:fade bind:this={mapElement} />
 {:else}
-{errorMessage}
+	{errorMessage}
 {/if}
 
 <style>