Index: sources/gui/qml/components/RangeSlider.qml
===================================================================
diff -u -r2b16e255a35e0f716bfa9d6943b35e4199dcf3b0 -r2f0b2e204b42597e08be24df48a3b3d470b73051
--- sources/gui/qml/components/RangeSlider.qml	(.../RangeSlider.qml)	(revision 2b16e255a35e0f716bfa9d6943b35e4199dcf3b0)
+++ sources/gui/qml/components/RangeSlider.qml	(.../RangeSlider.qml)	(revision 2f0b2e204b42597e08be24df48a3b3d470b73051)
@@ -67,6 +67,9 @@
     property bool   maxAdjusted : false                             ///< first time user adjustment happens
     property bool   hasAdjust   : false                             ///< if set to true then component is grayed out until both min and max are adjusted
 
+    property bool showTickmarks     : true                          ///< Indicate whether tickMarks should be shown
+    property bool isTickMarksRound  : true                          ///< Indicate whether the tickmakrs are round
+
     onHasAdjustChanged  : {
         setAdjusted()
     }
@@ -79,11 +82,15 @@
 
     /// root attributes
     clip            :  false
+    color: Colors.transparent
 
     height          : Variables.progressbarHeight
     touchMargin     : 25
     leftRightTouchMargin: _root.diameter / 2
 
+    isRoundedEnds   : true
+    hasBorder       : true
+
     minimum         : 0
     maximum         : 0
 
@@ -108,7 +115,7 @@
     ///
     function setAdjusted() {
         function check() {
-            _rangeRect   .color = minAdjusted && maxAdjusted ? Colors.createTreatmentActive : Colors.createTreatmentInactive
+            _rangeRect   .color = minAdjusted && maxAdjusted ? Colors.sliderHighlightColor : Colors.createTreatmentInactive
             _handlerLeft .color = minAdjusted ? Colors.createTreatmentActive: Colors.createTreatmentInactive
             _handlerRight.color = maxAdjusted ? Colors.createTreatmentActive: Colors.createTreatmentInactive
         }
@@ -245,8 +252,9 @@
         width   : minmaxDiff ? ((parent.width * (upperBound - lowerBound    )) / minmaxDiff) : minmaxDiff
         height  : parent.height
 
-        radius  : 0
         decimal : _root.decimal
+        isRoundedEnds   : _root.isRoundedEnds
+        hasBorder       : _root.hasBorder
 
         minText {
             visible: false
@@ -278,13 +286,20 @@
     Loader { id: _ticksLoader
         active          : _root.ticks
         anchors.fill    : parent
-        sourceComponent : TickMarks {
+        sourceComponent : _root.showTickmarks ? _tickMarkFactory : undefined
+    }
+
+    Component { id:_tickMarkFactory
+        TickMarks {
             decimal     : _root.decimal
             minimum     : _root.minimum
             maximum     : _root.maximum
             step        : _root.step
             stepSnap    : _root.stepSnap
             textColor   : _root.color
+            lineTickMarkHeight:  _rangeRect.height
+            isTickMarkRound : _root.isTickMarksRound
+            yDisplacement   : _root.isTickMarksRound ? (-_rangeRect.height) : 0
         }
     }