Index: sources/gui/qml/components/NotificationBar.qml
===================================================================
diff -u -re58be51c4aa52938af250db3ee579e98de08542c -r45ce6e781782be5de1480a1e7acecd1d272bcc84
--- sources/gui/qml/components/NotificationBar.qml	(.../NotificationBar.qml)	(revision e58be51c4aa52938af250db3ee579e98de08542c)
+++ sources/gui/qml/components/NotificationBar.qml	(.../NotificationBar.qml)	(revision 45ce6e781782be5de1480a1e7acecd1d272bcc84)
@@ -25,10 +25,9 @@
     objectName: "NotificationBar" // SquishQt
     property alias text             : _text.text
     property alias textColor        : _text.color
-    property int   level            : 0
-    property bool  isSilenced       : false
-    property int   muteTimeoutSec   : 0
-    property color backgroundColor  : Colors.textNotificationNoneBg
+    property alias isSilenced       : _muteButton.isSilenced
+    property alias timeout          : _muteButton.timeout
+    property alias backgroundColor  : _root.color
     property alias iconVisible      : _icon.visible
 
     visible : _text.text
@@ -41,14 +40,9 @@
         right   : parent.right
     }
 
-    signal clickedNotificationBar()
+    signal maximizeClicked()
+    signal clicked()
 
-    function toggleSilence(silence, timeoutSec) {
-        isSilenced = silence;
-        muteTimeoutSec = !isSilenced ? 0 : timeoutSec;
-        _bell.source = isSilenced ? "qrc:/images/iBellOff" : "qrc:/images/iBellOn"
-    }
-
     Image {
         id: _icon
         source: "qrc:/images/iAlarm"
@@ -68,37 +62,33 @@
 
     }
 
-    Image {
-        id: _bell
-        source: isSilenced ? "qrc:/images/iBellOff" : "qrc:/images/iBellOn"
-        anchors.left: _root.left
-        anchors.leftMargin: Variables.silenceIconMargin;
-        anchors.verticalCenter: parent.verticalCenter;
-        sourceSize.height: Variables.notificationBarIconHeight;
-        sourceSize.width: Variables.notificationBarIconWidth;
-    }
-
-    Text { id: _timeout_text
-        color               : Colors.textMain;
-        anchors.left        : _bell.right
-        anchors.leftMargin  : Variables.notificationBarIconMargin;
-        anchors.verticalCenter: parent.verticalCenter;
-        font.pixelSize      : Fonts.fontPixelNotification
-        horizontalAlignment : Text.AlignHCenter
-        verticalAlignment   : Text.AlignVCenter
-        text: muteTimeoutSec; // will be 60 second or less (see PRS)
-        visible: isSilenced;
-    }
-
     MouseArea {
         id: _TouchArea
         anchors.fill: parent;
-        onClicked: _root.clickedNotificationBar()
+        onClicked: _root.clicked()
     }
 
-
-    onLevelChanged: {
-        [_root.color, _text.color] = getRootTextFromAlarmLevel(level);
+    MuteButton { id: _muteButton
+        anchors {
+            verticalCenter  : _root.verticalCenter
+            left            : _root.left
+            leftMargin      : Variables.silenceIconMargin
+        }
+        // might be another event
+        // but call the same as the rest of the bar for now
+        // when it has it's own event then the borderColor transparency can be removed as well
+        // to indicate the touchable area.
+        borderColor: Colors.transparent
+        onClicked: _root.clicked()
     }
 
+    UpDownButton {
+        isUp: true
+        anchors {
+            verticalCenter  : _root.verticalCenter
+            right           : _root.right
+            rightMargin     : Variables.silenceIconMargin
+        }
+        onClicked: _root.maximizeClicked()
+    }
 }