[Graph] Range Slider styling

dist/styles/range-slider.css

@@ -9,5 +9,12 @@
   position: absolute;
   cursor: pointer;
 }
+.range-slider .knob .button {
+  top: -7px;
+  background: #f00;
+  width: 10px;
+  height: 10px;
+  border-radius: 50%;
+}
 
 /*# sourceMappingURL=range-slider.css.map */

dist/styles/range-slider.sass

@@ -8,3 +8,11 @@
   .knob
     position: absolute
     cursor: pointer
+
+    .button
+      top: -7px
+
+      background: #f00
+      width: 10px
+      height: 10px
+      border-radius: 50%

src/Gargantext/Components/GraphExplorer/Controls.purs

@@ -90,7 +90,7 @@ useGraphControls :: R.Hooks (Record Controls)
 useGraphControls = do
   cursorSize <- R.useState' 10.0
   labelSize <- R.useState' 3.0
-  nodeSize <- R.useState' $ Range.Closed { min: 5.0, max: 5.0 }
+  nodeSize <- R.useState' $ Range.Closed { min: 5.0, max: 10.0 }
   multiNodeSelect <- R.useRef false
   showControls <- R.useState' false
   showEdges <- R.useState' true

src/Gargantext/Components/RangeSlider.purs

@@ -178,7 +178,10 @@ renderScale ref {width,height} {min, max} =
     style = { width: "100%", height: "3px" }
 
 renderKnob ref val bounds knob set epsilon =
-  H.div { ref, tabIndex, className, aria, onMouseDown, style } [ H.text (text $ Just val) ]
+  H.div { ref, tabIndex, className, aria, onMouseDown, style } [
+      H.div { className: "button" } []
+    , H.text (text $ Just val)
+  ]
   where
     text (Just num) = show num
     text Nothing = "error"