Index: sources/gui/qml/pages/settings/SettingsDateTime.qml
===================================================================
diff -u -r934354462a353ff5e7fc2ddfe6f3a8f0121a8f3f -r3d5bd682a4dc4bd36e26ca17067bafd489fa970b
--- sources/gui/qml/pages/settings/SettingsDateTime.qml	(.../SettingsDateTime.qml)	(revision 934354462a353ff5e7fc2ddfe6f3a8f0121a8f3f)
+++ sources/gui/qml/pages/settings/SettingsDateTime.qml	(.../SettingsDateTime.qml)	(revision 3d5bd682a4dc4bd36e26ca17067bafd489fa970b)
@@ -22,6 +22,7 @@
 //  Qml imports
 import "qrc:/globals"
 import "qrc:/components"
+import "qrc:/compounds"
 
 /*!
  * \brief   SettingsDateTimeSet is used to adjust the
@@ -61,95 +62,104 @@
     }
 
     contentItem: Column { id: _container
-        spacing: 70
-        Behavior on y { NumberAnimation { duration: Variables.keybardAnimationDuration } }
+        spacing : 25
 
-        Row { // time
-            spacing: 5
-            anchors.horizontalCenter: parent.horizontalCenter
-            Text { id: _timeLabel
-                width: labelWidth
-                text: qsTr("Time (HH:MM)")
-                color: Colors.textMain
-                font.pixelSize: Fonts.fontPixelTextRectExtra
-            }
+        LabelUnitContainer { id: _timeContainer
+            anchors.horizontalCenter        : parent.horizontalCenter
+            width                           : Variables.adjustmentLabelUnitContainerWidth
+            height                          : Variables.adjustmentLabelUnitContainerHeight
+            text                            : qsTr("Time")
+            unitText                        : qsTr("HH:MM")
 
-            TextEntry { id      : _hours
-                nextInput       : _minutes
-                label.visible   : false
-                width           : entryWidth
-                validator       : IntValidator {
-                    bottom      : 0
-                    top         : 23
+            contentItem: Row { // time
+                spacing         : 10
+                anchors.centerIn: parent
+
+                TextEntry { id: _hours
+                    nextInput           : _minutes
+                    line.visible        : false
+                    width               : entryWidth
+                    showPlaceHolderText : true
+                    validator           : IntValidator {
+                        bottom  : 0
+                        top     : 23
+                    }
+                    textInput.font.pixelSize: Fonts.fontPixelValueControl
                 }
-            }
 
-            Text { id           : _colon
-                text            : qsTr(":")
-                color           : Colors.textMain
-                font.pixelSize  : Fonts.fontPixelTextRectExtra
-            }
+                Label {
+                    text    : qsTr(":")
+                    width   : 10
+                }
 
-            TextEntry { id      : _minutes
-                nextInput       : _month
-                label.visible   : false
-                width           : entryWidth
-                validator       : IntValidator {
-                    bottom      : 0
-                    top         : 59
+                TextEntry { id: _minutes
+                    nextInput           : _month
+                    line.visible        : false
+                    width               : entryWidth
+                    showPlaceHolderText : true
+                    validator           : IntValidator {
+                        bottom  : 0
+                        top     : 59
+                    }
+                    textInput.font.pixelSize: Fonts.fontPixelValueControl
                 }
             }
         }
 
-        Row { // date
-            spacing: 5
-            anchors.horizontalCenter: parent.horizontalCenter
+        LabelUnitContainer { id: _dateContainer
+            anchors.horizontalCenter        : parent.horizontalCenter
+            width                           : Variables.adjustmentLabelUnitContainerWidth
+            height                          : Variables.adjustmentLabelUnitContainerHeight
+            text                            : qsTr("Date")
+            unitText                        : qsTr("MM/DD/YYYY")
 
-            Text { id           : _dateLabel
-                width           : labelWidth
-                text            : qsTr("Date (MM/DD/YYYY)")
-                color           : Colors.textMain
-                font.pixelSize  : Fonts.fontPixelTextRectExtra
-            }
+            contentItem: Row { // time
+                spacing         : 10
+                anchors.centerIn: parent
 
-            TextEntry { id      : _month
-                nextInput       : _day
-                label.visible   : false
-                width           : entryWidth
-                validator       : IntValidator {
-                    bottom      : 1
-                    top         : 12
+                TextEntry { id: _month
+                    nextInput           : _day
+                    line.visible        : false
+                    width               : entryWidth
+                    showPlaceHolderText : true
+                    validator           : IntValidator {
+                        bottom      : 1
+                        top         : 12
+                    }
+                    textInput.font.pixelSize: Fonts.fontPixelValueControl
                 }
-            }
 
-            Text { id           : _slashMonthDay
-                text            : qsTr("/")
-                color           : Colors.textMain
-                font.pixelSize  : Fonts.fontPixelTextRectExtra
-            }
+                Label { id  : _slashMonthDay
+                    text    : qsTr(":")
+                    width   : 10
+                }
 
-            TextEntry { id      : _day
-                nextInput       : _year
-                label.visible   : false
-                width           : entryWidth
-                validator       : IntValidator {
-                    bottom      : 1
-                    top         : 31
+                TextEntry { id: _day
+                    nextInput           : _year
+                    line.visible        : false
+                    width               : entryWidth
+                    showPlaceHolderText : true
+                    validator           : IntValidator {
+                        bottom      : 1
+                        top         : 31
+                    }
+                    textInput.font.pixelSize: Fonts.fontPixelValueControl
                 }
-            }
 
-            Text { id           : _slashDayYear
-                text            : qsTr("/")
-                color           : Colors.textMain
-                font.pixelSize  : Fonts.fontPixelTextRectExtra
-            }
+                Label { id  : _slashDayYear
+                    text    : qsTr(":")
+                    width   : 10
+                }
 
-            TextEntry { id      : _year
-                label.visible   : false
-                width           : entryWidth
-                validator       : IntValidator {
-                    bottom      : 1970
-                    top         : 2100 // seems date command is not accepting more than 2100
+                TextEntry { id: _year
+                    line.visible        : false
+                    width               : entryWidth
+                    showPlaceHolderText : true
+                    validator           : IntValidator {
+                        bottom      : 1970
+                        top         : 2100 // seems date command is not accepting more than 2100
+                    }
+                    textInput.font.pixelSize: Fonts.fontPixelValueControl
                 }
             }
         }