RomanNum3ral
/
vert
mirror of https://github.com/VERT-sh/VERT.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

feat: pretty dragover animation

This commit is contained in:
Realmy 2025-02-09 18:55:26 +01:00
parent 5b07832267
commit 55dd9c0eb7
1 changed files with 30 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
src/routes/+layout.svelte
View File

@ -168,7 +168,8 @@
>
{#if dropping}
<div
class="fixed w-screen h-screen bg-accent-blue opacity-40 dynadark:opacity-20 z-[100] pointer-events-none"
class="dragoverlay fixed w-screen h-screen opacity-50 dynadark:opacity-20 z-[100] pointer-events-none blur-2xl"
class:_dragover={dropping}
transition:fade={{
duration,
easing: quintOut,
@ -329,3 +330,31 @@
style="background: var(--bg-gradient-pink);"
></div>
{/if}
<style>
.dragoverlay {
animation: dragoverlay-animation 3s infinite linear;
}
@keyframes dragoverlay-animation {
0% {
@apply bg-accent-pink;
}
25% {
@apply bg-accent-blue;
}
50% {
@apply bg-accent-purple;
}
75% {
@apply bg-accent-red;
}
100% {
@apply bg-accent-pink;
}
}
</style>