feat: add drag-and-drop file upload to Cloud folders

Drag files over the native file browser area to see a drop zone overlay
with dashed orange border. Dropping files triggers the existing upload
handler. Uses debounced dragleave to prevent flicker between children.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Dorian
2026-03-05 07:08:57 +00:00
co-authored by Claude Opus 4.6
parent 37105e6be6
commit 621d74bfb3
3 changed files with 67 additions and 2 deletions
+28
View File
@@ -1220,3 +1220,31 @@ html:has(body.video-background-active)::before {
border-radius: 2px;
transition: width 0.3s linear;
}
/* ── Cloud Drag-and-Drop Overlay ──── */
.cloud-drop-overlay {
position: absolute;
inset: 0;
z-index: 30;
display: flex;
align-items: center;
justify-content: center;
background: rgba(0, 0, 0, 0.6);
backdrop-filter: blur(8px);
-webkit-backdrop-filter: blur(8px);
border-radius: 0.75rem;
border: 2px dashed rgba(251, 146, 60, 0.6);
animation: drop-overlay-in 0.2s ease-out;
}
.cloud-drop-overlay-inner {
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
padding: 2rem;
}
@keyframes drop-overlay-in {
from { opacity: 0; }
to { opacity: 1; }
}