[tree] some styling fixes

dist/styles/Tree.css

@@ -36,6 +36,7 @@ li .leaf:hover a.settings {
 .tree ul li::before {
   bottom: -12px;
   content: " ";
+  height: 7px;
   position: absolute;
   top: 5px;
 }
@@ -50,6 +51,15 @@ li .leaf:hover a.settings {
   width: 1px;
   top: 5px;
 }
+.tree ul li.with-children::after {
+  background-color: #000;
+}
+.tree ul li.with-children::before {
+  background-color: #000;
+}
+.tree .lefthanded .leaf {
+  justify-content: flex-end;
+}
 .tree .lefthanded ul {
   margin-right: 5px;
 }
@@ -58,17 +68,15 @@ li .leaf:hover a.settings {
   padding-right: 5px;
 }
 .tree .lefthanded ul li.with-children::after {
-  background-color: #000;
   right: -10px;
   width: 5px;
 }
 .tree .lefthanded ul li.with-children::before {
-  background-color: #000;
   right: -10px;
   width: 1px;
 }
-.tree .lefthanded ul li .leaf {
-  justify-content: flex-end;
+.tree .righthanded .leaf {
+  justify-content: flex-start;
 }
 .tree .righthanded ul {
   margin-left: 5px;
@@ -78,12 +86,10 @@ li .leaf:hover a.settings {
   padding-left: 5px;
 }
 .tree .righthanded ul li.with-children::after {
-  background-color: #000;
   left: -10px;
   width: 5px;
 }
 .tree .righthanded ul li.with-children::before {
-  background-color: #000;
   left: -10px;
   width: 1px;
 }
@@ -91,9 +97,6 @@ li .leaf:hover a.settings {
   background-color: #000;
   right: 10px;
 }
-.tree .righthanded ul li .leaf {
-  justify-content: flex-start;
-}
 .tree .file-dropped {
   background-color: #d8dfe5;
 }

dist/styles/Tree.sass

@@ -31,6 +31,7 @@ li
       &::before
         bottom: -12px
         content: " "
+        height: 7px
         position: absolute
         top: 5px
       &:not(:first-child):last-child::before
@@ -43,8 +44,15 @@ li
         position: absolute
         width: 1px
         top: 5px
+      &.with-children
+        &::after
+          background-color: #000
+        &::before
+          background-color: #000
 
   .lefthanded
+    .leaf
+      justify-content : flex-end
     ul
       margin-right : 5px
       li
@@ -52,18 +60,16 @@ li
         padding-right: 5px
         &.with-children
           &::after
-            background-color: #000
             right: -10px
             width: 5px
           &::before
-            background-color: #000
             right: -10px
             width: 1px
           &:only-child::before
             //right: 1px
-        .leaf
-          justify-content : flex-end
   .righthanded
+    .leaf
+      justify-content : flex-start
     ul
       margin-left : 5px
       li
@@ -71,18 +77,14 @@ li
         padding-left: 5px
         &.with-children
           &::after
-            background-color: #000
             left: -10px
             width: 5px
           &::before
-            background-color: #000
             left: -10px
             width: 1px
           &:only::before
             background-color: #000
             right: 10px
-        .leaf
-          justify-content : flex-start
 
   .file-dropped
     background-color: #d8dfe5