fix(ui5-upload-collеction): hide the upload icon when the height is t…

…oo small

According to the design:
The icon should be displayed only when the height of the Drag
enabled container is more than 10rem.

fixes: #9975
downport of #9990

packages/fiori/src/themes/UploadCollection.css

@@ -23,6 +23,7 @@
 	align-items: center;
 	justify-content: center;
 	border-radius: var(--ui5_upload_collection_drag_overlay_border_radius);
+	container-type: size;
 }
 
 .uc-drag-overlay {
@@ -66,6 +67,14 @@
 	color: var(--ui5_upload_collection_drag_overlay_icon_color);
 }
 
+/* Hide the icon when the container is too small */
+@container (max-height: 10rem) {
+	.uc-dnd-overlay [ui5-icon] {
+		display: none;
+
+	}
+}
+
 .uc-dnd-overlay .dnd-overlay-text {
 	font-family: "72override", var(--sapFontFamily);
 	font-size: var(--sapFontHeader4Size);

packages/fiori/test/pages/UploadCollection.html

@@ -208,5 +208,12 @@
 		</ui5-upload-collection-item>
 
 	</ui5-upload-collection>
+
+	<ui5-upload-collection>
+        <ui5-upload-collection-item file-name="LaptopHT-1000.jpg" upload-state="Complete">
+            uploadState="Complete"
+            <img src="https://sap.github.io/ui5-webcomponents/nightly/images/HT-1000.jpg" slot="thumbnail">
+        </ui5-upload-collection-item>
+    </ui5-upload-collection>
 </body>
 </html>