Move upload progressbar from attachment to fileList

diff --git a/ts/WoltLabSuite/Core/Component/Attachment/Entry.ts b/ts/WoltLabSuite/Core/Component/Attachment/Entry.ts
index 64e75fd04e592d33b745bff4a2b493c248a6d740..0dc0d3a3059ed77a27b1e21708c0bfc6b114cfc9 100644 (file)
--- a/ts/WoltLabSuite/Core/Component/Attachment/Entry.ts
+++ b/ts/WoltLabSuite/Core/Component/Attachment/Entry.ts
@@ -190,10 +190,10 @@ function markElementAsErroneous(element: HTMLElement, errorMessage: string): voi
 
 function trackUploadProgress(element: HTMLElement, file: WoltlabCoreFileElement): void {
   const progress = document.createElement("progress");
-  progress.classList.add("attachment__item__progress__bar");
+  progress.classList.add("fileList__item__progress__bar");
   progress.max = 100;
   const readout = document.createElement("span");
-  readout.classList.add("attachment__item__progress__readout");
+  readout.classList.add("fileList__item__progress__readout");
 
   file.addEventListener("uploadProgress", (event: CustomEvent<number>) => {
     progress.value = event.detail;
@@ -203,7 +203,7 @@ function trackUploadProgress(element: HTMLElement, file: WoltlabCoreFileElement)
       element.classList.add("attachment__item--uploading");
 
       const wrapper = document.createElement("div");
-      wrapper.classList.add("attachment__item__progress");
+      wrapper.classList.add("fileList__item__progress");
       wrapper.append(progress, readout);
 
       element.append(wrapper);
@@ -217,7 +217,7 @@ function removeUploadProgress(element: HTMLElement): void {
   }
 
   element.classList.remove("attachment__item--uploading");
-  element.querySelector(".attachment__item__progress")?.remove();
+  element.querySelector(".fileList__item__progress")?.remove();
 }
 
 export function createAttachmentFromFile(file: WoltlabCoreFileElement, editor: HTMLElement) {

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Component/Attachment/Entry.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Component/Attachment/Entry.js
index 95efe5dc1644994abcfff563b697f49dfad0a998..8de7461f288bf038020a0a9d0d42f819e7d32751 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Component/Attachment/Entry.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Component/Attachment/Entry.js
@@ -143,17 +143,17 @@ define(["require", "exports", "tslib", "WoltLabSuite/Core/FileUtil", "WoltLabSui
     }
     function trackUploadProgress(element, file) {
         const progress = document.createElement("progress");
-        progress.classList.add("attachment__item__progress__bar");
+        progress.classList.add("fileList__item__progress__bar");
         progress.max = 100;
         const readout = document.createElement("span");
-        readout.classList.add("attachment__item__progress__readout");
+        readout.classList.add("fileList__item__progress__readout");
         file.addEventListener("uploadProgress", (event) => {
             progress.value = event.detail;
             readout.textContent = `${event.detail}%`;
             if (progress.parentNode === null) {
                 element.classList.add("attachment__item--uploading");
                 const wrapper = document.createElement("div");
-                wrapper.classList.add("attachment__item__progress");
+                wrapper.classList.add("fileList__item__progress");
                 wrapper.append(progress, readout);
                 element.append(wrapper);
             }
@@ -164,7 +164,7 @@ define(["require", "exports", "tslib", "WoltLabSuite/Core/FileUtil", "WoltLabSui
             return;
         }
         element.classList.remove("attachment__item--uploading");
-        element.querySelector(".attachment__item__progress")?.remove();
+        element.querySelector(".fileList__item__progress")?.remove();
     }
     function createAttachmentFromFile(file, editor) {
         const element = document.createElement("li");

diff --git a/wcfsetup/install/files/style/ui/attachment.scss b/wcfsetup/install/files/style/ui/attachment.scss
index 5d5cc9861c9f617506c1d31cf8f490e79aba936f..6c30e974fbdeb5b2d6de9a3c831c48614a645e48 100644 (file)
--- a/wcfsetup/install/files/style/ui/attachment.scss
+++ b/wcfsetup/install/files/style/ui/attachment.scss
@@ -136,17 +136,6 @@ html[data-color-scheme="dark"] {
 }
 
 /* attachments tab in editor */
-.attachment__item__progress {
-       align-items: center;
-       column-gap: 10px;
-       display: flex;
-       grid-area: buttons;
-}
-
-.attachment__item__progress__readout {
-       @include wcfFontSmall;
-}
-
 .formAttachmentContent {
        .formAttachmentList {
                display: flex;

diff --git a/wcfsetup/install/files/style/ui/fileList.scss b/wcfsetup/install/files/style/ui/fileList.scss
index cb0e140cf0590cf6aca594230315d765cb73eb2e..77eb78d04fb8fca1af94c8fad0f0bf6d2f048ae4 100644 (file)
--- a/wcfsetup/install/files/style/ui/fileList.scss
+++ b/wcfsetup/install/files/style/ui/fileList.scss
@@ -61,3 +61,14 @@
        grid-area: buttons;
        justify-content: end;
 }
+
+.fileList__item__progress {
+       align-items: center;
+       column-gap: 10px;
+       display: flex;
+       grid-area: buttons;
+}
+
+.fileList__item__progress__readout {
+       @include wcfFontSmall;
+}