ENGCOM-8119: #1797: The vertical image is not centered in Category image preview #29869

 - Merge Pull Request #29869 from joweecaquicla/magento2:1797-vertical-image-not-centered-in-category-image-preview
 - Merged commits:
   1. c60dd36
   2. 28d04b0
   3. 45ebee4

Author: magento-engcom-team

app/code/Magento/MediaGalleryUi/Test/Mftf/ActionGroup/AdminEnhancedMediaGalleryAssertImagesDeletedInBulkActionGroup.xml

@@ -12,7 +12,9 @@
         <annotations>
             <description>Asserts images has been deleted in mass action.</description>
         </annotations>
-
-        <see userInput='Assets have been successfully deleted' stepKey="verifyDeleteImages"/>
+        <arguments>
+            <argument name="numberOfAssetsDeleted" type="string"/>
+        </arguments>
+        <see userInput='{{numberOfAssetsDeleted}} assets have been successfully deleted.' stepKey="verifyDeleteImages"/>
     </actionGroup>
 </actionGroups>

app/code/Magento/MediaGalleryUi/Test/Mftf/Test/AdminEnhancedMediaGalleryDeleteImagesInBulkTest.xml

@@ -52,7 +52,9 @@
         </actionGroup>
         <actionGroup ref="AdminEnhancedMediaGalleryClickDeleteImagesButtonActionGroup" stepKey="clikDeleteSelectedButton"/>
         <actionGroup ref="AdminEnhancedMediaGalleryConfirmDeleteImagesActionGroup" stepKey="deleteImages"/>
-        <actionGroup ref="AdminEnhancedMediaGalleryAssertImagesDeletedInBulkActionGroup" stepKey="assertImagesDeleted"/>
+        <actionGroup ref="AdminEnhancedMediaGalleryAssertImagesDeletedInBulkActionGroup" stepKey="assertImagesDeleted">
+            <argument name="numberOfAssetsDeleted" value="2"/>
+        </actionGroup>
         <actionGroup ref="AdminEnhancedMediaGalleryAssertMassActionModeNotActiveActionGroup" stepKey="assertMassectionModeDisabled"/>
     </test>
 </tests>

app/design/adminhtml/Magento/backend/web/css/source/components/_image-uploader.less

@@ -9,8 +9,8 @@
 
 .image-uploader {
     .image-upload-requirements {
-        margin-top: 8px;
         font-size: .9em;
+        margin-top: 8px;
     }
 
     .image-placeholder {
@@ -19,12 +19,12 @@
     }
 
     .image-uploader-spinner {
-        width: 50%;
-        height: 50%;
         background-size: auto;
+        height: 50%;
         margin: 0;
-        transform: translate(50%, 50%);
         position: absolute;
+        transform: translate(50%, 50%);
+        width: 50%;
     }
 
     .image-uploader-preview {
@@ -33,7 +33,10 @@
 
     .image-uploader-preview-link,
     .image-uploader-preview-link .preview-image {
+        display: block;
         height: inherit;
+        margin-left: auto;
+        margin-right: auto;
     }
 }