Index: sources/gui/qml/compounds/InstructionView.qml
===================================================================
diff -u -r2230a5b1b891f47b64165164710aa680ddfc7040 -rac07818fa03e65ff3601535b790bb6cb4e34f731
--- sources/gui/qml/compounds/InstructionView.qml	(.../InstructionView.qml)	(revision 2230a5b1b891f47b64165164710aa680ddfc7040)
+++ sources/gui/qml/compounds/InstructionView.qml	(.../InstructionView.qml)	(revision ac07818fa03e65ff3601535b790bb6cb4e34f731)
@@ -27,24 +27,31 @@
  *          as the current progress in each of the steps.
  */
 Rectangle { id: _root
+    property string label       : ""
+
     property string location    : ""
     property var    stepNames   : []
     property var    stepImages  : []
 
+    property int    fontPixelMessage    : 25
+    property int    fontPixelLabel      : 20
+
     property alias currentStepIndex: _swipeview.currentIndex
 
     readonly property bool  isEmpty         : stepNames.length == 0 && stepImages.length == 0
     readonly property bool  firstStep       : isEmpty || _swipeview.currentIndex == 0
     readonly property bool  lastStep        : isEmpty || _swipeview.currentIndex == _swipeview.count - 1
 
-    readonly property int   frameVGap     : 47
-    readonly property int   frameHGap     : frameVGap * 1.5
-    readonly property int   chevronWidth  : 25
-    readonly property int   chevronHeight : 35
-    readonly property int   chevronMargin : ( _root.frameHGap - _root.chevronWidth ) / 2
-    readonly property int   outerRadius   : Variables.dialogRadius * 2
-    readonly property int   innerRadius   : Variables.dialogRadius
+    readonly property int   frameVGapTop    : 65
+    readonly property int   frameVGapBottom : 45
+    readonly property int   frameHGap       : 45 // * 1.5
+    readonly property int   chevronWidth    : 25
+    readonly property int   chevronHeight   : 35
+    readonly property int   chevronMargin   : ( _root.frameHGap - _root.chevronWidth ) / 2
+    readonly property int   outerRadius     : Variables.dialogRadius * 2
+    readonly property int   innerRadius     : Variables.dialogRadius
 
+
     signal leftClicked ()
     signal rightClicked()
 
@@ -59,13 +66,13 @@
             fill    : _root
             leftMargin  : _root.frameHGap
             rightMargin : _root.frameHGap
-            topMargin   : _root.frameVGap
-            bottomMargin: _root.frameVGap
+            topMargin   : _root.frameVGapTop
+            bottomMargin: _root.frameVGapBottom
         }
         radius          : _root.innerRadius
         // DEBUG : This helps getting the final size of the available room for the instruction images.
-        // onWidthChanged  : console.debug( " ----- ", "_innerFrame.width :" , width )
-        // onHeightChanged : console.debug( " ----- ", "_innerFrame.height:" , height)
+        // onWidthChanged  : console.debug( " ----- ", "_innerFrame.width :" , width , label)
+        // onHeightChanged : console.debug( " ----- ", "_innerFrame.height:" , height, label)
     }
 
     Item { id: _containerSwipeView
@@ -88,35 +95,55 @@
                             text    : _root.stepNames.length ? _root.stepNames[index] : ""
                             color   : Colors.textMain
                             width   : parent.width
-                            height  : _root.frameVGap
-                            horizontalAlignment: Text.AlignHCenter
-                            verticalAlignment: Text.AlignVCenter
-                            font.pixelSize: Fonts.fontPixelDialogText
+                            height  : _root.frameVGapTop
+                            horizontalAlignment : Text.AlignHCenter
+                            verticalAlignment   : Text.AlignVCenter
+                            font.pixelSize      : _root.fontPixelMessage
                         }
                         Image { id: _image
                             source: _root.stepImages.length && _root.stepImages[index] ? "file:" + _root.location + _root.stepImages[index] : ""
                             width   : _innerFrame.width
                             height  : _innerFrame.height
-                            anchors.centerIn: parent
-                            horizontalAlignment: Image.AlignHCenter
-                            verticalAlignment: Image.AlignVCenter
-                            fillMode: Image.PreserveAspectFit
+                            anchors.top                 : parent.top
+                            anchors.topMargin           : _root.frameVGapTop
+                            anchors.horizontalCenter    : parent.horizontalCenter
+                            horizontalAlignment : Image.AlignHCenter
+                            verticalAlignment   : Image.AlignVCenter
+                            fillMode            : Image.PreserveAspectFit
                         }
                     }
                 }
             }
         }
     }
 
-    StepIndicator { id: _indicator
-        visible         : _root.stepNames.length
-        currentComplete : true
-        hideLabels      : true
-        stepNames       : _root.stepNames
-        currentStepIndex: _swipeview.currentIndex
+    Item {
+        anchors.left    : _innerFrame.left
+        anchors.right   : _innerFrame.right
         anchors.top     : _innerFrame.bottom
         anchors.bottom  : _root.bottom
-        anchors.horizontalCenter: _root.horizontalCenter
+        Text { id: _label
+            text    : _root.label
+            color   : Colors.textMain
+            width   : parent.width
+            height  : _root.frameVGapBottom
+            horizontalAlignment : Text.AlignLeft
+            verticalAlignment   : Text.AlignVCenter
+            font.pixelSize      : _root.fontPixelLabel
+            anchors.verticalCenter: parent.verticalCenter
+            anchors.left        : parent.left
+        }
+        StepIndicator { id: _indicator
+            diameter        : 10
+            spacerLineLength: 25
+            visible         : _root.stepNames.length
+            currentComplete : true
+            hideLabels      : true
+            stepNames       : _root.stepNames
+            currentStepIndex: _swipeview.currentIndex
+            anchors.verticalCenter: parent.verticalCenter
+            anchors.right   : parent.right
+        }
     }
 
     Image { id: _leftImage
@@ -142,7 +169,7 @@
 
     MouseArea { id: _mouseAreaLeft
         enabled         : ! _root.firstStep
-        width           : _root.frameHGap
+        width           : _root.frameHGap * 2 // mouse area is intenrionally set twice the size of the visible area for user convenience
         anchors.left    : _root.left
         anchors.top     : _root.top
         anchors.bottom  : _root.bottom
@@ -151,9 +178,9 @@
             _root.leftClicked
         }
     }
-    MouseArea {id: _mouseAreaRight
+    MouseArea { id: _mouseAreaRight
         enabled         : ! _root.lastStep
-        width           : _root.frameHGap
+        width           : _root.frameHGap * 2 // mouse area is intenrionally set twice the size of the visible area for user convenience
         anchors.right   : _root.right
         anchors.top     : _root.top
         anchors.bottom  : _root.bottom