[tree] fixes to tree icon styling (use flex)

dist/styles/Login.css

@@ -102,25 +102,24 @@ li#rename #rename-a {
   min-width: 200px;
 }
 
-li a#rename {
-  display: none;
-  position: absolute;
-  text-decoration: none;
-  left: 26px;
+li .leaf {
+  display: flex;
+  flex-direction: row;
+  justify-content: flex-start;
 }
-li a#rename-leaf {
-  display: none;
-  position: absolute;
-  text-decoration: none;
-  margin-left: 20px;
-  cursor: pointer;
-  z-index: 1;
+li .leaf .folder-icon {
+  padding: 0 2 0 2;
 }
-li:hover a#rename {
+li .leaf a.settings {
+  cursor: pointer;
   display: block;
+  padding: 0 2 0 2;
+  text-decoration: none;
+  visibility: hidden;
+  z-index: 1;
 }
-li:hover a#rename-leaf {
-  display: block;
+li .leaf:hover a.settings {
+  visibility: visible;
 }
 
 .glyphitem {

dist/styles/Login.sass

@@ -95,26 +95,25 @@ li#rename
       min-width: 200px
 
 li
-  a#rename
-    display: none
-    position: absolute
-    text-decoration: none
-    left: 26px
+  .leaf
+    display: flex
+    flex-direction: row
+    justify-content: flex-start
 
-  a#rename-leaf
-    display: none
-    position: absolute
-    text-decoration: none
-    margin-left: 20px
+    .folder-icon
+      padding: 0 2 0 2
+
+    a.settings
       cursor: pointer
+      display: block
+      padding: 0 2 0 2
+      text-decoration: none
+      visibility: hidden
       z-index: 1
 
     &:hover
-    a#rename
-      display: block
-
-    a#rename-leaf
-      display: block
+      a.settings
+        visibility: visible
 
 
 .glyphitem

src/Gargantext/Components/Forest/Tree/Node/Box.purs

@@ -76,14 +76,6 @@ nodeMainSpan p@{ dispatch, folderOpen, frontends, session } = R.createElement el
 
       pure $ H.span (dropProps droppedFile isDragOver) $
         [ folderIcon nodeType folderOpen
-        , H.a { href: (url frontends (GT.NodePath (sessionId session) nodeType (Just id)))
-              , style: { marginLeft: case nodeType of
-                                       NodeUser -> "1rem"
-                                       _        -> "22px"
-                       }
-              }
-          [ nodeText { isSelected: (mCorpusId mCurrentRoute) == (Just id)
-                     , name: name' props} ]
         , if showBox then
             Popover.popover { open: false
                             , onClose: \_ -> pure unit
@@ -93,6 +85,10 @@ nodeMainSpan p@{ dispatch, folderOpen, frontends, session } = R.createElement el
               , mNodePopupView props (onPopoverClose popoverRef)
             ]
           else H.div {} []
+        , H.a { href: (url frontends (GT.NodePath (sessionId session) nodeType (Just id)))
+              }
+          [ nodeText { isSelected: (mCorpusId mCurrentRoute) == (Just id)
+                     , name: name' props} ]
         , fileTypeView {dispatch, droppedFile, id, isDragOver, nodeType}
         , H.div {} (map (\t -> asyncProgressBar { asyncTask: t
                                                 , corpusId: id
@@ -107,13 +103,12 @@ nodeMainSpan p@{ dispatch, folderOpen, frontends, session } = R.createElement el
     name' {name, nodeType} = if nodeType == GT.NodeUser then show session else name
 
     folderIcon nodeType folderOpen'@(open /\ _) =
-      H.a {onClick: R2.effToggler folderOpen'}
+      H.a { className: "folder-icon"
+          , onClick: R2.effToggler folderOpen' }
       [ H.i {className: GT.fldr nodeType open} [] ]
 
     popOverIcon =
-      H.a { className: "glyphicon glyphicon-cog"
-          , id: "rename-leaf"
-          } []
+      H.a { className: "settings fa fa-cog" } []
 
     mNodePopupView props@{asyncTasks, id, nodeType} onPopoverClose =
       nodePopupView { id
@@ -125,7 +120,7 @@ nodeMainSpan p@{ dispatch, folderOpen, frontends, session } = R.createElement el
                     }
 
     dropProps droppedFile isDragOver =
-      { className: dropClass droppedFile isDragOver
+      { className: "leaf " <> (dropClass droppedFile isDragOver)
       , on: { drop: dropHandler droppedFile
             , dragOver: onDragOverHandler isDragOver
             , dragLeave: onDragLeave isDragOver } }