fix safari margin issue on icon

src/Umbraco.Web.UI.Client/src/less/components/umb-grid-selector.less

@@ -31,18 +31,20 @@
 }
 
 .umb-grid-selector__item-content {
-  margin-top: 20px;
+  margin-top: 10px;
 }
 
 .umb-grid-selector__item-icon {
   font-size: 50px;
   color: #d9d9d9;
+  display: block;
+  line-height: 50px;
+  margin-bottom: 5px;
 }
 
 .umb-grid-selector__item-label {
   font-size: 13px;
   font-weight: bold;
-  margin-top: 5px;
 }
 
 .umb-grid-selector__item-label.-blue {
@@ -70,4 +72,4 @@
 
 .umb-grid-selector__item-add {
   color: @blue;
-}
+}

src/Umbraco.Web.UI.Client/src/views/components/umb-grid-selector.html

@@ -21,7 +21,7 @@
         </div>
 
         <a href="" class="umb-grid-selector__item -placeholder" ng-if="(availableItems | compareArrays:selectedItems:'alias').length > 0" ng-click="openItemPicker($event)" hotkey="alt+shift+t">
-            <div>
+            <div class="umb-grid-selector__item-content">
                 <div class="umb-grid-selector__item-label -blue" ng-if="defaultItem !== null">Choose extra {{ itemLabel }}</div>
                 <div class="umb-grid-selector__item-label -blue" ng-if="defaultItem === null">Choose default {{ itemLabel }}</div>
             </div>