diff --git a/filed/static/dragndrop-form.js b/filed/static/dragndrop-form.js index 9bb2d98..6b3a527 100644 --- a/filed/static/dragndrop-form.js +++ b/filed/static/dragndrop-form.js @@ -10,6 +10,9 @@ const drag_rop = document.getElementsByClassName('file-drag-n-drop-inside')[0]; const dr_rop_t = document.getElementsByClassName('file-drag-n-drop-inside-text')[0]; + /** @type {HTMLInputElement} */ + const input_el = document.getElementById('bfile-formupload-file'); + function drag_end() { root_drag_rop.style.background = 'var(--header-sec-color)' drag_rop.style.borderColor = '#656565'; @@ -31,14 +34,16 @@ if (!drdrop_enabled) return; if (e.dataTransfer.items) { - for (let i = 0; i != e.dataTransfer.items.length; i++) { - let file = e.dataTransfer.items[i].getAsFile(); - text.innerText = 'Processing...'; - drdrop_enabled = false; - await fill_bg(); - drdrop_enabled = true; - text.innerText = `Selected file: ${file.name.substring(0,16)}${file.name.length > 16 ? '...' : ''}\nYou can drop another file to replace this one`; - } + let file = e.dataTransfer.items[0].getAsFile(); + text.innerText = 'Processing...'; + drdrop_enabled = false; + await fill_bg(); + drdrop_enabled = true; + text.innerText = `Selected file: ${file.name.substring(0,16)}${file.name.length > 16 ? '...' : ''}\nYou can drop another file to replace this one`; + + const transfer = new DataTransfer(); + transfer.items.add(file); + input_el.files = transfer.files; } }); drag_rop.addEventListener('dragover', e => { diff --git a/filed/static/paint.css b/filed/static/paint.css index f674091..5741338 100644 --- a/filed/static/paint.css +++ b/filed/static/paint.css @@ -101,6 +101,13 @@ p { background: var(--header-color); border: 1px solid var(--header-sec-color); border-radius: 12px; + width: fit-content; + transition: 250ms ease; +} +@media (max-width:667px) { + .card { + width: 100%; + } } .card-title { border-radius: 12px 12px 0 0;