Index: sources/gui/qml/components/Slider.qml
===================================================================
diff -u -raf8d98b36b427e2b5f4d6659fcf3b58ee79eab6a -r5f6975c6ee7823fc884328418298128cdb97107f
--- sources/gui/qml/components/Slider.qml	(.../Slider.qml)	(revision af8d98b36b427e2b5f4d6659fcf3b58ee79eab6a)
+++ sources/gui/qml/components/Slider.qml	(.../Slider.qml)	(revision 5f6975c6ee7823fc884328418298128cdb97107f)
@@ -31,6 +31,7 @@
 
     property bool   ticks              : false
 
+    // TODO  suggest to BN that we should rename color to progressBarBgColor because slider's rangeRect has a color property also
     property alias  color              : _progressRect.color
     property alias  bgColor            : _root.color
 
@@ -53,10 +54,10 @@
 
     function setActive(active) {
         if (active) {
-            color = Colors.createTreatmentActive
+            color        = Colors.sliderHighlightColor
             handlerColor = Colors.createTreatmentActive
         } else {
-            color = Colors.createTreatmentInactive
+            color        = Colors.createTreatmentInactive
             handlerColor = Colors.createTreatmentInactive
         }
 
@@ -149,51 +150,45 @@
         }
     }
 
-    ProgressRect { id: _progressRect
-        color       : Colors.highlightProgressBar
-        decimal : _root.decimal
-        minimum : _root.minimum
-        maximum : _root.maximum
-        height: 5
-        // propagation is not working on drag !
-        onDragged: {
-            setValue(vMouseEvent.x)
-            progressRectDragged()
-        }
-        onClicked: {
-            setValue(vMouseEvent.x)
-            progressRectClicked()
-        }
-        onPressed: {
-            setValue(vMouseEvent.x)
-            _root.pressed(vMouseEvent)
-        }
-        onReleased: {
-            setValue(vMouseEvent.x)
-            _root.released(vMouseEvent)
-        }
-        onWidthChanged: {
-            // TODO: DEN-5603 : Still has some issues on high resolution sliders [ handler jumps to the 0 ].
-            // setHandlerPosition()
-        }
-    }
-
     // used loader for performance since it may not always be required.
     // and can be a heavy Component
     Loader { id: _ticksLoader
         active          : ticks
         anchors.fill    : parent
         sourceComponent : TickMarks {
-            thickness   : _root.tickMarksThickness
             decimal     : _root.decimal
             minimum     : _root.minimum
             maximum     : _root.maximum
             step        : _root.step
             stepSnap    : _root.stepSnap
             textColor   : _root.color
+            lineTickMarkHeight      : _progressRect.height
+            lineTickMarkThickness   : _root.tickMarksThickness
+            isTickMarkRound : _root.isRoundedEnds
+            yDisplacement   : _root.isRoundedEnds ? (-_progressRect.height) : 0
         }
     }
+    ProgressRect { id: _progressRect
+        color   : Colors.transparent
+        decimal : _root.decimal
+        minimum : _root.minimum
+        maximum : _root.maximum
 
+        isRoundedEnds       : _root.isRoundedEnds
+        hasBorder           : _root.hasBorder
+
+        // propagation is not working on drag !
+        onDragged: {
+            _root.dragged(vMouseEvent)
+        }
+        onPressed: {
+            _root.pressed(vMouseEvent)
+        }
+        onReleased: {
+            _root.released(vMouseEvent)
+        }
+    }
+
     onDragged: {
         setValue(vMouseEvent.x)
     }