Prevent overflow of searchresults with long urls (#9739)

* Prevent overflow of searchresults with long urls

Small css change to prevent overflow of searchresults with long url's

* fixes wrapping in node-picker search, stop icon shrinking

Co-authored-by: Nathan Woulfe <nathan@nathanw.com.au>

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

@@ -48,6 +48,8 @@
         color: @gray-7;
         display: block;
         padding-left: 35px;
+        white-space: initial;
+        text-align: left;
     }
 }
 
@@ -102,10 +104,9 @@ body.touch .umb-tree {
         .umb-button-ellipsis--hidden {
             opacity: 1;
         }
-        
+         
         .umb-tree-icon {
             color: @ui-option-type-hover;
-            flex-shrink: 0;
         }
     }
 }
@@ -161,8 +162,10 @@ body.touch .umb-tree {
         &-name {
             display: flex;
 
-            &__text {
+            &__text { 
                 margin: 1px 0 0;
+                overflow:hidden;
+                text-overflow: ellipsis;
             }
         }
     }
@@ -337,7 +340,6 @@ body.touch .umb-tree {
 .umb-tree-icon { 
     vertical-align: middle;
     margin: 0 13px 0 0;
-    //color: @gray-1;
     color: @ui-option-type;
     font-size: 20px;   
     

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

@@ -2,6 +2,7 @@
     display: inline-block;
     width: 1em;
     height: 1em;
+    flex-shrink: 0;
 
     svg {
         width: 100%;