Index: sources/gui/qml/components/Slider.qml
===================================================================
diff -u -raf8d98b36b427e2b5f4d6659fcf3b58ee79eab6a -r839893734937449efb6e7c31787d2c44515b69af
--- sources/gui/qml/components/Slider.qml	(.../Slider.qml)	(revision af8d98b36b427e2b5f4d6659fcf3b58ee79eab6a)
+++ sources/gui/qml/components/Slider.qml	(.../Slider.qml)	(revision 839893734937449efb6e7c31787d2c44515b69af)
@@ -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,8 @@
 
     function setActive(active) {
         if (active) {
-            color = Colors.createTreatmentActive
             handlerColor = Colors.createTreatmentActive
         } else {
-            color = Colors.createTreatmentInactive
             handlerColor = Colors.createTreatmentInactive
         }
 
@@ -149,33 +148,10 @@
         }
     }
 
-    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()
-        }
+    Rectangle { id: _progressRectBackground
+       anchors.fill : _progressRect
+       color        : _root.isActive ? Colors.sliderHighlightColor : Colors.createTreatmentInactive
+       radius       : _root.isRoundedEnds ? (height/2) : 0
     }
 
     // used loader for performance since it may not always be required.
@@ -191,9 +167,33 @@
             step        : _root.step
             stepSnap    : _root.stepSnap
             textColor   : _root.color
+            length      : _progressRect.height
+            isTickMarkRound : _root.isRoundedEnds
+            yDisplacement   : _root.isRoundedEnds ? (-_progressRect.height) : 0
         }
     }
+    ProgressRect { id: _progressRect
+        property real previousSliderValue: Number.NaN
+        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)
     }