Merge pull request #21470 from overleaf/jdt-file-upload-limit-notif

[Web] Update 180 file upload limit notification style

GitOrigin-RevId: 860567d8e1218c0d2a89d019c116b59be15132e7

services/web/frontend/js/features/file-tree/components/file-tree-create/modes/file-tree-upload-doc.tsx

@@ -156,6 +156,12 @@ export default function FileTreeUploadDoc() {
           return conflicts.length === 0 && folderConflicts.length === 0
         },
         autoProceed: true,
+        locale: {
+          strings: {
+            youCanOnlyUploadX:
+              'You can only upload %{smart_count} files at a time',
+          },
+        },
       })
         // use the basic XHR uploader
         .use(XHRUpload, {

services/web/frontend/stylesheets/app/editor/file-tree.less

@@ -545,4 +545,12 @@
     width: 26em; // sized to create a wrap between the sentences
     max-width: 100%;
   }
+
+  .uppy-Informer p {
+    background-color: @blue-10;
+    border: 1px solid @blue-20;
+    border-radius: @border-radius-base-new;
+    color: @content-primary;
+    font-size: @font-size-03;
+  }
 }

services/web/frontend/stylesheets/bootstrap-5/pages/editor/file-tree.scss

@@ -635,4 +635,12 @@
     width: 26em; // sized to create a wrap between the sentences
     max-width: 100%;
   }
+
+  .uppy-Informer p {
+    background-color: var(--bg-info-03);
+    border: 1px solid var(--blue-20);
+    border-radius: var(--border-radius-base);
+    color: var(--content-primary);
+    font-size: var(--font-size-03);
+  }
 }