[Treeview] Cleanup order

Rearrange the sass so that classes appear in the
order that they appear in browse.html, with
correct nesting as well.
No changes to the actual UI from this.

platform/commonUI/general/res/css/theme-espresso.css

@@ -5133,28 +5133,13 @@ input[type="text"] {
   /* line 35, ../sass/tree/_pane.scss */
   .pane.left.inactive .tree-holder {
     padding-right: 0; }
-
+/* line 41, ../sass/tree/_pane.scss */
-/* line 44, ../sass/tree/_pane.scss */
+.pane.left .create-btn.major {
-.splitter-bar.left {
-  opacity: 1;
-  transition: opacity 0.35s, visibility 0.35s;
-  top: 0; }
-  /* line 51, ../sass/tree/_pane.scss */
-  .splitter-bar.left.inactive {
-    visibility: hidden;
-    opacity: 0;
-    transition: opacity 0s, visibility 0s; }
-    /* line 57, ../sass/tree/_pane.scss */
-    .splitter-bar.left.inactive:before {
-      border-width: 0; }
-
-/* line 64, ../sass/tree/_pane.scss */
-.create-btn.major {
   top: 0;
   left: 0;
   transition: all 0.35s; }
-  /* line 69, ../sass/tree/_pane.scss */
+  /* line 46, ../sass/tree/_pane.scss */
-  .create-btn.major.inactivePane {
+  .pane.left .create-btn.major.inactivePane {
     top: 0;
     left: 0;
     position: relative;
@@ -5166,10 +5151,24 @@ input[type="text"] {
     line-height: 14px;
     left: -11px;
     top: 20px; }
-    /* line 87, ../sass/tree/_pane.scss */
+    /* line 64, ../sass/tree/_pane.scss */
-    .create-btn.major.inactivePane span {
+    .pane.left .create-btn.major.inactivePane span {
       display: none; }
 
+/* line 74, ../sass/tree/_pane.scss */
+.splitter-bar.left {
+  opacity: 1;
+  transition: opacity 0.35s, visibility 0.35s;
+  top: 0; }
+  /* line 81, ../sass/tree/_pane.scss */
+  .splitter-bar.left.inactive {
+    visibility: hidden;
+    opacity: 0;
+    transition: opacity 0s, visibility 0s; }
+    /* line 87, ../sass/tree/_pane.scss */
+    .splitter-bar.left.inactive:before {
+      border-width: 0; }
+
 /* line 94, ../sass/tree/_pane.scss */
 .items.pane {
   transition: left 0.35s;
@@ -5177,12 +5176,11 @@ input[type="text"] {
   /* line 98, ../sass/tree/_pane.scss */
   .items.pane.leftInactive {
     left: 0 !important; }
-
+  /* line 103, ../sass/tree/_pane.scss */
-/* line 104, ../sass/tree/_pane.scss */
+  .items.pane .object-browse-bar {
-.object-browse-bar {
     position: relative; }
-  /* line 107, ../sass/tree/_pane.scss */
+    /* line 106, ../sass/tree/_pane.scss */
-  .object-browse-bar .left-pane-tabs {
+    .items.pane .object-browse-bar .left-pane-tabs {
       position: relative;
       cursor: pointer;
       left: -10px;
@@ -5194,15 +5192,15 @@ input[type="text"] {
       border-top-right-radius: 2px;
       border-bottom-right-radius: 2px;
       background-color: #595959; }
-    /* line 124, ../sass/tree/_pane.scss */
+      /* line 123, ../sass/tree/_pane.scss */
-    .object-browse-bar .left-pane-tabs.inactivePane {
+      .items.pane .object-browse-bar .left-pane-tabs.inactivePane {
         left: -15px; }
-      /* line 127, ../sass/tree/_pane.scss */
+        /* line 126, ../sass/tree/_pane.scss */
-      .object-browse-bar .left-pane-tabs.inactivePane:after {
+        .items.pane .object-browse-bar .left-pane-tabs.inactivePane:after {
           content: '>'; }
-    /* line 131, ../sass/tree/_pane.scss */
+      /* line 130, ../sass/tree/_pane.scss */
-    .object-browse-bar .left-pane-tabs.activePane:after {
+      .items.pane .object-browse-bar .left-pane-tabs.activePane:after {
         content: '<'; }
-  /* line 136, ../sass/tree/_pane.scss */
+    /* line 135, ../sass/tree/_pane.scss */
-  .object-browse-bar .items-select {
+    .items.pane .object-browse-bar .items-select {
       margin-left: 10px; }

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

@@ -36,29 +36,6 @@ $transitionTime: 0.35s;
             padding-right: 0;
         }
     }
-}
-
-// Hide the splitter bar when the left pane is closed
-// Fade the splitter bar in when opening menu, but immediately fade
-//   out when closing menu 
-.splitter-bar.left {
-    opacity: 1;
-    transition: opacity $transitionTime, visibility $transitionTime;
-    
-    // Make the splitter bar vertically span to the top
-    top: 0;
-    
-    &.inactive {
-        visibility: hidden;
-        opacity: 0;
-        
-        transition: opacity 0s, visibility 0s;
-        
-        &:before {
-            border-width: 0;
-        }
-    }
-}
     
     // When the pane is closed, move and resize the create button
     .create-btn.major {
@@ -89,6 +66,29 @@ $transitionTime: 0.35s;
             }
         }
     }
+}
+
+// Hide the splitter bar when the left pane is closed
+// Fade the splitter bar in when opening menu, but immediately fade
+//   out when closing menu 
+.splitter-bar.left {
+    opacity: 1;
+    transition: opacity $transitionTime, visibility $transitionTime;
+    
+    // Make the splitter bar vertically span to the top
+    top: 0;
+    
+    &.inactive {
+        visibility: hidden;
+        opacity: 0;
+        
+        transition: opacity 0s, visibility 0s;
+        
+        &:before {
+            border-width: 0;
+        }
+    }
+}
 
 // The main view needs to align left when the panes are moving around
 .items.pane {
@@ -98,7 +98,6 @@ $transitionTime: 0.35s;
     &.leftInactive {
         left: 0 !important;
     }
-}
     
     // Move buttons close to the splitter bar 
     .object-browse-bar {
@@ -137,3 +136,4 @@ $transitionTime: 0.35s;
             margin-left: 10px;
         }
     }
+}