Index: sources/gui/qml/pages/treatment/sections/TreatmentFlowsComponent.qml
===================================================================
diff -u -re36852d9548379bd861d4b0838761d2aa5243dad -ra926324fec65c7f3cede4c746352af173f787458
--- sources/gui/qml/pages/treatment/sections/TreatmentFlowsComponent.qml	(.../TreatmentFlowsComponent.qml)	(revision e36852d9548379bd861d4b0838761d2aa5243dad)
+++ sources/gui/qml/pages/treatment/sections/TreatmentFlowsComponent.qml	(.../TreatmentFlowsComponent.qml)	(revision a926324fec65c7f3cede4c746352af173f787458)
@@ -1,7 +1,7 @@
 
 // Qt
 import QtQuick 2.12
-import QtGraphicalEffects 1.12
+import QtQuick.Effects
 
 // Project
 
@@ -11,43 +11,66 @@
 import "qrc:/pages/treatment"
 
 Rectangle { id: _root
+    objectName: "_TreatmentFlowsComponent"
 
-    property string title           : ""
-    property string value           : ""
-    property string unitText        : ""
-    property string extraText       : ""
-    property alias  value           : _value.topText
+    property string title               : ""
+    property string unitText            : ""
+    property string extraText           : ""
+    property alias  value               : _rangedValue.rawValue
+    property alias  minimum             : _rangedValue.rawMin
+    property alias  maximum             : _rangedValue.rawMax
+    property alias  step                : _rangedValue.rawStep
+    property alias  precision           : _rangedValue.precision
+    property bool   showButtons         : true
+    property bool   buttonsEnabled      : true
+    property bool   dropShadowEnabled   : true
+    property bool   canOff              : false
+    property bool   runAnimation        : false
+    property real   pulseAlpha          : 1
 
-    property bool   showButtons       : true
-    property bool   buttonsEnabled    : true
-    property bool   dropShadowEnabled : true
-
     color   : Colors.mainTreatmentLighterBlue
     radius  : 5
 
-    signal increment()
-    signal decrement()
+    border {
+        width: 4
+        color: _root.runAnimation ? Qt.rgba(255/255, 184/255, 54/255, pulseAlpha) : Colors.mainTreatmentLighterBlue
+    }
 
+    signal increment(real newValue)
+    signal decrement(real newValue)
+
+    NumberAnimation on pulseAlpha {
+        from        : 0.2
+        to          : 1
+        duration    : 1000
+        loops       : Animation.Infinite
+        easing.type : Easing.InOutQuad
+        running     : _root.runAnimation
+    }
+
+    RangedValue { id: _rangedValue
+        objectName  : "_rangedValue"
+    }
+
     Text { id: _title
         objectName: "title"
 
         anchors {
             horizontalCenter        : _root.horizontalCenter
-            horizontalCenterOffset  : Variables.defaultMargin * 1.5
             top                     : parent.top
             topMargin               :  Variables.defaultMargin
         }
 
         font {
-            pixelSize   : 28
-            weight      : Font.Normal
+            pixelSize   : Fonts.fontPixelContainerTitle
+            weight      : Font.Medium
         }
 
         width           : _root.width
         height          : Variables.contentHeight
         text            : _root.title
         color           : Colors.pressuresText
-        horizontalAlignment : Text.AlignLeft
+        horizontalAlignment : Text.AlignHCenter
     }
 
     Row { id: _row
@@ -67,9 +90,11 @@
             }
             height                  : Variables.contentHeight
             width                   : Variables.treatmentFlowsComponentWidth
-            topText                 : value
+            topText                 : value !== undefined ? _root.canOff && value < minimum ? qsTr("OFF") :
+                                                                                              _root.value.toFixed(_root.precision) :
+                                                            Variables.emptyEntry
             topTextFont.pixelSize   : 60
-            topTextFont.weight      : Font.Medium
+            topTextFont.weight      : Font.Light
             bottomText              : _root.unitText
             bottomTextFont.pixelSize: 22
             bottomTextTopMargin     : Variables.defaultMargin
@@ -105,29 +130,25 @@
             ArrowButton {id : _upArrowIcon
                 objectName  : "upArrowIcon"
                 upArrow     : true
-                enabled     : buttonsEnabled
+                enabled     : buttonsEnabled && _rangedValue.canIncrement
 
-                onClicked   : _root.increment()
+                onClicked   : { _root.increment(_rangedValue.incrementedValue()) }
             }
 
             ArrowButton {id : _downArrowIcon
                 objectName  : "downArrowIcon"
                 downArrow   : true
-                enabled     : buttonsEnabled
+                enabled     : buttonsEnabled && ( _root.canOff ? value >= minimum : _rangedValue.canDecrement )
 
-                onClicked   : _root.decrement()
+                onClicked   : { _root.decrement(_rangedValue.decrementedValue()) }
             }
         }
     }
 
     layer.enabled   : _root.dropShadowEnabled && _root.showButtons
-    layer.effect    : DropShadow { id: _dropShadow
-        horizontalOffset: 3
-        verticalOffset  : 3
+    layer.effect    : RectangularShadow { id: _dropShadow
         radius          : 3.0
-        samples         : 7
         color           : "#50000000"
-        source          : _root
         anchors.fill    : _root
     }
 }