From 5d9389b37c9f4687774b9b6d7998ccbf4eba3522 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <niels.lyngso@gmail.com>
Date: Mon, 28 Sep 2020 17:57:04 +0200
Subject: [PATCH] adjust default size of umb-button-ellipsis and its apperance
 in umb-tree

---
 .../src/less/components/buttons/umb-button-ellipsis.less | 9 +++++++--
 .../src/less/components/tree/umb-tree-root.less          | 4 +++-
 .../src/less/components/tree/umb-tree.less               | 6 +++---
 3 files changed, 13 insertions(+), 6 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/less/components/buttons/umb-button-ellipsis.less b/src/Umbraco.Web.UI.Client/src/less/components/buttons/umb-button-ellipsis.less
index 54302ba869..7104e6478f 100644
--- a/src/Umbraco.Web.UI.Client/src/less/components/buttons/umb-button-ellipsis.less
+++ b/src/Umbraco.Web.UI.Client/src/less/components/buttons/umb-button-ellipsis.less
@@ -4,10 +4,10 @@
     margin: 0 auto;
     cursor: pointer;
     border-radius: @baseBorderRadius;
-    color: black;
+    color: @ui-action-discreet-type;
     position: relative;
     opacity: 0.8;
-    transition: opacity .3s ease-out;
+    transition: opacity 120ms, color 120ms;
 
     &--absolute {
         position: absolute;
@@ -23,6 +23,10 @@
         justify-content: center;
     }
 
+    &:hover {
+        color: @ui-action-discreet-type-hover;
+    }
+
     .umb-button-ellipsis--tab,
     .umb-tour-is-visible .umb-tree &,
     &:hover,
@@ -47,6 +51,7 @@
     &__icon {
         color: inherit;
         flex-basis: 100%;
+        font-size: 12px;
 
         .umb-button-ellipsis--tab & {
             margin: 0 0 7px;
diff --git a/src/Umbraco.Web.UI.Client/src/less/components/tree/umb-tree-root.less b/src/Umbraco.Web.UI.Client/src/less/components/tree/umb-tree-root.less
index a3529d5504..ba33883b08 100644
--- a/src/Umbraco.Web.UI.Client/src/less/components/tree/umb-tree-root.less
+++ b/src/Umbraco.Web.UI.Client/src/less/components/tree/umb-tree-root.less
@@ -1,5 +1,7 @@
-.umb-tree-root {    
+.umb-tree-root {
     
+    border: 2px solid transparent;
+
     &-link {
         display: flex;
         align-items: center;
diff --git a/src/Umbraco.Web.UI.Client/src/less/components/tree/umb-tree.less b/src/Umbraco.Web.UI.Client/src/less/components/tree/umb-tree.less
index d4599ea03d..bf8e7fdb70 100644
--- a/src/Umbraco.Web.UI.Client/src/less/components/tree/umb-tree.less
+++ b/src/Umbraco.Web.UI.Client/src/less/components/tree/umb-tree.less
@@ -95,7 +95,6 @@ body.touch .umb-tree {
             position: relative;
             width: auto;
             height: auto;
-            margin: 0 5px 0 auto;
             overflow: visible;
             clip: auto;
         }
@@ -185,9 +184,10 @@ body.touch .umb-tree {
     flex: 0 0 auto;
     justify-content: flex-end;
     text-align: center;
-    margin: 0 5px 0 auto;
+    margin: 0 10px 0 auto;
     cursor: pointer;
     border-radius: @baseBorderRadius;
+    transition: background-color 120ms;
 
     .umb-button-ellipsis {
         padding: 3px 5px;
@@ -207,7 +207,7 @@ body.touch .umb-tree {
     }
 
     &:hover {
-        background: rgba(255, 255, 255, .5);
+        background-color: rgba(255, 255, 255, .8);
 
         i {
             background: @ui-active-type-hover;