Fix issues when using custom font icons in backoffice.

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

@@ -26,7 +26,9 @@
    justify-content: center;
 }
 
-.umb-content-grid__icon {
+.umb-content-grid__icon,
+.umb-content-grid__icon[class^="icon-"],
+.umb-content-grid__icon[class*=" icon-"] {
    font-size: 40px;
    color: lighten(@gray, 20%);
 }

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

@@ -37,7 +37,9 @@
    align-items: center;
 }
 
-.umb-folder-grid__folder-icon {
+.umb-folder-grid__folder-icon,
+.umb-folder-grid__folder-icon[class^="icon-"],
+.umb-folder-grid__folder-icon[class*=" icon-"] {
    font-size: 20px;
    margin-right: 15px;
    color: @black;

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

@@ -51,7 +51,9 @@
    border: 1px solid @blue;
 }
 
-.umb-layout-selector__dropdown-item-icon {
+.umb-layout-selector__dropdown-item-icon,
+.umb-layout-selector__dropdown-item-icon[class^="icon-"],
+.umb-layout-selector__dropdown-item-icon[class*=" icon-"] {
    font-size: 20px;
    color: @gray;
    text-align: center;

src/Umbraco.Web.UI.Client/src/less/components/umb-table.less

@@ -101,16 +101,21 @@ input.umb-table__input {
     }
 }
 
-.umb-table-body__icon {
+.umb-table-body__icon,
+.umb-table-body__icon[class^="icon-"],
+.umb-table-body__icon[class*=" icon-"] {
     margin: 0 auto;
-
     font-size: 22px;
+    line-height: 22px;
     color: @blueDark;
 }
 
-.umb-table-body__checkicon {
+.umb-table-body__checkicon,
+.umb-table-body__checkicon[class^="icon-"],
+.umb-table-body__checkicon[class*=" icon-"] {
     display: none;
     font-size: 16px;
+    line-height: 22px;
 }
 
 .umb-table-body .umb-table__name {

src/Umbraco.Web.UI.Client/src/less/tree.less

@@ -418,9 +418,9 @@ div.locked:before{
 	padding-left: 10px;
 }
 .umb-actions-child li .menu-label {
-	font-size: 12px;
+	font-size: 14px;
 	color: #000;
-	margin-left: 20px;
+	margin-left: 10px;
 }
 
 .umb-actions-child li .menu-label small {
@@ -436,6 +436,9 @@ div.locked:before{
 }
 .umb-actions-child i {
 	font-size: 32px;
+    min-width: 32px;
+    text-align: center;
+    line-height: 24px; /* set line-height to ensure all icons use same line-height */
 }
 
 .umb-actions-child li.add {

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

@@ -9,7 +9,7 @@
       <i ng-if="item.selected" class="icon-check umb-content-grid__checkmark"></i>
 
       <div class="umb-content-grid__icon-container">
-         <i class="{{ item.icon }} umb-content-grid__icon" ng-class="{'-light': !item.published}"></i>
+          <i class="umb-content-grid__icon {{ item.icon }}" ng-class="{'-light': !item.published}"></i>
       </div>
 
       <div class="umb-content-grid__content">