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:
co-authored by
Claude Opus 4.6
parent
37105e6be6
commit
621d74bfb3
@@ -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; }
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user