Add toast

frontend/src/lib/components/Toast.svelte

@@ -0,0 +1,46 @@
+<script>
+	import { onDestroy, onMount } from 'svelte';
+	export let message = "L'applicazione è pronta per funzionare offline!";
+	let show = false;
+	let nodeRef;
+
+	onMount(() => {
+		show = true;
+		setTimeout(() => {
+			show = false;
+			setTimeout(() => {
+				nodeRef.parentNode.removeChild(nodeRef);
+			}, 5000);
+		}, 5000);
+	});
+
+	onDestroy(() => {
+		show = false;
+	});
+</script>
+
+<div bind:this={nodeRef} id="toast" class:show>
+	<img src="/icons/checkmark.svg" alt="check" />
+	<div>{message}</div>
+</div>
+
+<style>
+	.show {
+		transform: translateY(0vh) !important;
+	}
+	#toast {
+		transform: translateY(10vh);
+		transition: transform ease 0.4s;
+		position: fixed;
+		height: 10vh;
+		display: flex;
+		bottom: 0;
+		z-index: 4;
+		left: 0;
+		width: 100%;
+		justify-content: center;
+		background-color: #f6ae04;
+		color: black;
+		place-items: center;
+	}
+</style>