Initial commit0.1.0

1 files changed, 18 insertions, 0 deletions

diff --git a/frontend/src/lib/components/Dropdown.svelte b/frontend/src/lib/components/Dropdown.svelte
new file mode 100644
index 0000000..9e935e4
--- /dev/null
+++ b/frontend/src/lib/components/Dropdown.svelte
@@ -0,0 +1,18 @@
+<script lang="ts">
+	import { clickOutside } from '$lib/Actions';
+	import { fadeFast } from '$lib/Transitions';
+	import { fade } from 'svelte/transition';
+
+	export let visible: boolean;
+	export let parent: HTMLElement;
+</script>
+
+{#if visible}
+	<div
+		class="absolute z-[1] mt-1 w-max rounded bg-slate-700 p-1 shadow-sm shadow-slate-900"
+		transition:fade={fadeFast}
+		use:clickOutside={{ handler: () => (visible = false), ignore: parent }}
+	>
+		<slot />
+	</div>
+{/if}