From 71733b72d9c5416e0e2bda2d29891cdd69837648 Mon Sep 17 00:00:00 2001
From: Bjarne Fyrstenborg <bjarne_fyrstenborg@hotmail.com>
Date: Tue, 14 Sep 2021 09:57:16 +0200
Subject: [PATCH] Remove restricted image size when opening media (#10940)

* Remove restricted image size as SVG are vector and we already handle max size in css

* Use css class instead of inline style

* Add required src and alt attributes to img tag - ng-src will populate value of src attribute

* Align folder icon in medie entry editor
---
 .../mediaentryeditor/mediaentryeditor.html               | 2 +-
 .../mediaentryeditor/mediaentryeditor.less               | 9 ++++++---
 .../src/views/components/imaging/umb-image-gravity.html  | 4 ++--
 3 files changed, 9 insertions(+), 6 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/mediaentryeditor/mediaentryeditor.html b/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/mediaentryeditor/mediaentryeditor.html
index b2899cf6dc..938d719431 100644
--- a/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/mediaentryeditor/mediaentryeditor.html
+++ b/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/mediaentryeditor/mediaentryeditor.html
@@ -75,7 +75,7 @@
                                 ng-class="{'trashed': vm.media.trashed}"
                                 extension="{{vm.media.extension}}"
                                 icon="{{vm.media.icon}}"
-                                size="s"
+                                size="m"
                                 text="{{vm.media.name}}">
                             </umb-file-icon>
 
diff --git a/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/mediaentryeditor/mediaentryeditor.less b/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/mediaentryeditor/mediaentryeditor.less
index 1de962f7e1..139d7bef4a 100644
--- a/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/mediaentryeditor/mediaentryeditor.less
+++ b/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/mediaentryeditor/mediaentryeditor.less
@@ -84,6 +84,7 @@
                 width: 4px;
             }
         }
+
         &.--is-defined {
 
         }
@@ -109,14 +110,16 @@
 }
 
 .umb-media-entry-editor__imageholder {
-    display: block;
+    display: flex;
+    align-items: center;
+    justify-content: center;
     position: relative;
     height: calc(100% - 50px);
 }
+
 .umb-media-entry-editor__imageholder-actions {
-    background-color: white;
+    background-color: @white;
     height: 50px;
     display: flex;
     justify-content: center;
 }
-
diff --git a/src/Umbraco.Web.UI.Client/src/views/components/imaging/umb-image-gravity.html b/src/Umbraco.Web.UI.Client/src/views/components/imaging/umb-image-gravity.html
index 10aa6a774a..e74c1d8d65 100644
--- a/src/Umbraco.Web.UI.Client/src/views/components/imaging/umb-image-gravity.html
+++ b/src/Umbraco.Web.UI.Client/src/views/components/imaging/umb-image-gravity.html
@@ -3,8 +3,8 @@
 	<div class="gravity-container" ng-show="vm.loaded">
         <div class="viewport">
 
-            <img ng-show="vm.isCroppable" ng-src="{{vm.src}}" draggable="false" />
-            <img ng-show="!vm.isCroppable && !vm.hasDimensions" ng-src="{{vm.src}}" width="200" height="200" draggable="false" style="cursor: default;" />
+            <img ng-show="vm.isCroppable" ng-src="{{vm.src}}" src="" alt="" draggable="false" />
+            <img ng-show="!vm.isCroppable && !vm.hasDimensions" ng-src="{{vm.src}}" src="" alt="" draggable="false" class="cursor-default" />
 
         </div>
         <div class="overlayViewport">