From d1a55aabc944a7428880943319d67a227e266f22 Mon Sep 17 00:00:00 2001 From: Giteabot Date: Mon, 14 Aug 2023 23:55:18 +0800 Subject: [PATCH] Move dropzone progress bar to bottom to show filename when uploading (#26492) (#26497) Backport #26492 by @wxiaoguang 1. Make the "filename" visible 2. Avoiding UI flicker when the uploading is completing Co-authored-by: wxiaoguang --- web_src/css/features/dropzone.css | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/web_src/css/features/dropzone.css b/web_src/css/features/dropzone.css index 0ce067ef30..509dbf1dfe 100644 --- a/web_src/css/features/dropzone.css +++ b/web_src/css/features/dropzone.css @@ -51,3 +51,9 @@ .dropzone .dz-preview:hover .dz-image img { filter: opacity(0.5) !important; } + +.ui .field .dropzone .dz-preview .dz-progress { + /* by default the progress-bar is vertically centered (top: 50%), it's better to put it after the "details (size, filename)", + then the layout from top to bottom is: size, filename, progress */ + top: 7em; +}