[Frontend] Refactor CSS to not use 'desktop' media query

open #639
Refactored all usage of @include desktop to use CSS selector body.desktop
instead; Still to-do: deal with desktopandtablet usage with hover bubbles
and mixins btnBase;

platform/commonUI/general/res/sass/tree/_tree.scss

@@ -63,11 +63,6 @@ ul.tree {
                 @include transform(rotate(90deg));
             }
         }
-		@include desktop {
-			&:hover {
-				color: $colorItemTreeVCHover !important;
-			}
-		}
 	}
 
 	.t-object-label {
@@ -94,18 +89,6 @@ ul.tree {
 		}
 	}
 
-	&:not(.selected) {
-		@include desktop {
-			&:hover {
-				background: $colorItemTreeHoverBg;
-				color: $colorItemTreeHoverFg;
-				.t-item-icon {
-					color: $colorItemTreeIconHover;
-				}
-			}
-		}
-	}
-
 	&:not(.loading) {
 		cursor: pointer;
 	}
@@ -123,6 +106,26 @@ ul.tree {
 	}
 }
 
+body.desktop {
+    .tree-item,
+    .search-result-item {
+        .view-control {
+            &:hover {
+                color: $colorItemTreeVCHover !important;
+            }
+        }
+        &:not(.selected) {
+            &:hover {
+                background: $colorItemTreeHoverBg;
+                color: $colorItemTreeHoverFg;
+                .t-item-icon {
+                    color: $colorItemTreeIconHover;
+                }
+            }
+        }
+    }
+}
+
 mct-representation {
     &.s-status-pending {
         .t-object-label {