From 40f7e87e048100e2e061971dceaba8cd84061ae8 Mon Sep 17 00:00:00 2001
From: bjarnef <bjarne_fyrstenborg@hotmail.com>
Date: Sat, 2 Apr 2016 13:36:55 +0200
Subject: [PATCH] Fix issues when using custom font icons in backoffice.

---
 .../src/less/components/umb-content-grid.less         |  4 +++-
 .../src/less/components/umb-folder-grid.less          |  4 +++-
 .../src/less/components/umb-layout-selector.less      |  4 +++-
 .../src/less/components/umb-table.less                | 11 ++++++++---
 src/Umbraco.Web.UI.Client/src/less/tree.less          |  7 +++++--
 .../src/views/components/umb-content-grid.html        |  2 +-
 6 files changed, 23 insertions(+), 9 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/less/components/umb-content-grid.less b/src/Umbraco.Web.UI.Client/src/less/components/umb-content-grid.less
index b34face8ba..aef523887c 100644
--- a/src/Umbraco.Web.UI.Client/src/less/components/umb-content-grid.less
+++ b/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%);
 }
diff --git a/src/Umbraco.Web.UI.Client/src/less/components/umb-folder-grid.less b/src/Umbraco.Web.UI.Client/src/less/components/umb-folder-grid.less
index 14e343652d..c7c7fb78e5 100644
--- a/src/Umbraco.Web.UI.Client/src/less/components/umb-folder-grid.less
+++ b/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;
diff --git a/src/Umbraco.Web.UI.Client/src/less/components/umb-layout-selector.less b/src/Umbraco.Web.UI.Client/src/less/components/umb-layout-selector.less
index 122107f88c..74d85461fa 100644
--- a/src/Umbraco.Web.UI.Client/src/less/components/umb-layout-selector.less
+++ b/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;
diff --git a/src/Umbraco.Web.UI.Client/src/less/components/umb-table.less b/src/Umbraco.Web.UI.Client/src/less/components/umb-table.less
index e53fe2ba94..874f9e9551 100644
--- a/src/Umbraco.Web.UI.Client/src/less/components/umb-table.less
+++ b/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 {
diff --git a/src/Umbraco.Web.UI.Client/src/less/tree.less b/src/Umbraco.Web.UI.Client/src/less/tree.less
index 185b5a6e3b..35de441137 100644
--- a/src/Umbraco.Web.UI.Client/src/less/tree.less
+++ b/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 {
diff --git a/src/Umbraco.Web.UI.Client/src/views/components/umb-content-grid.html b/src/Umbraco.Web.UI.Client/src/views/components/umb-content-grid.html
index 7443cdd393..499594253e 100644
--- a/src/Umbraco.Web.UI.Client/src/views/components/umb-content-grid.html
+++ b/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">