implement drag and drop feature

This commit is contained in:
2025-12-16 09:23:22 +01:00
parent 776cc7a1f0
commit b4d9824942

View File

@@ -287,8 +287,26 @@ Mit freundlichen Grüßen,
open = false;
isError = false;
}
// drag and drop functionality
let isDragging = $state(false);
function handleDrop(event) {
event.preventDefault();
isDragging = false;
if (event.dataTransfer?.files?.length) {
files = event.dataTransfer.files;
}
}
</script>
<svelte:window
on:dragover|preventDefault
on:drop|preventDefault
/>
{#if data.vorgang && crimesList}
<div class="-z-10 bg-white">
<div class="flex flex-col items-center justify-center w-full">
@@ -415,7 +433,13 @@ Mit freundlichen Grüßen,
</span>
</label>
<div
class="mt-2 flex justify-center rounded-lg border border-dashed border-gray-900/25 px-6 py-10"
class="mt-2 flex justify-center rounded-lg border border-dashed px-6 py-10
{isDragging
? 'border-blue-500 bg-blue-50'
: 'border-gray-900/25'}"
on:dragover|preventDefault={() => (isDragging = true)}
on:dragleave={() => (isDragging = false)}
on:drop={handleDrop}
>
<div class="text-center">
<FileRect />