1 files changed, 34 insertions, 16 deletions

diff --git a/framework/qml/Outbox.qml b/framework/qml/Outbox.qml
index 6b0a1650..ad398337 100644
--- a/framework/qml/Outbox.qml
+++ b/framework/qml/Outbox.qml
@@ -25,37 +25,55 @@ import org.kde.kirigami 1.0 as Kirigami
 import org.kube.framework 1.0 as Kube
 
 
-Kube.Button {
+Rectangle {
     id: root
 
-    text: outboxModel.count > 0 ? "Outbox (" + outboxModel.count + ")" : "Outbox"
-    color: "transparent"
-    textColor: Kube.Colors.highlightedTextColor
-    iconName: ""
+    Kube.OutboxController {
+        id: outboxController
+    }
+    Kube.OutboxModel {
+        id: outboxModel
+    }
+
     states: [
         State {
             name: "busy"; when: outboxModel.status == Kube.OutboxModel.InProgressStatus
-            PropertyChanges { target: root; iconName: Kube.Icons.busy }
+            PropertyChanges { target: icon; iconName: Kube.Icons.busy_inverted }
         },
         State {
             name: "error"; when: outboxModel.status == Kube.OutboxModel.ErrorStatus
-            PropertyChanges { target: root; iconName: Kube.Icons.error }
+            PropertyChanges { target: icon; iconName: Kube.Icons.error_inverted }
         }
     ]
 
-    onClicked: {
-        dialog.visible = dialog.visible ? false : true
-    }
-
-    Kube.OutboxController {
-        id: outboxController
+    color: Kube.Colors.textColor
+    clip: true
+
+    Row {
+        anchors.centerIn: parent
+        spacing: Kube.Units.smallSpacing
+        Text {
+            id: text
+            anchors.verticalCenter: parent.verticalCenter
+            text: outboxModel.count > 0 ? "Outbox (" + outboxModel.count + ")" : "Outbox"
+            color: Kube.Colors.highlightedTextColor
+        }
+        Icon {
+            id: icon
+            anchors.verticalCenter: parent.verticalCenter
+            iconName: ""
+            visible: iconName != ""
+        }
     }
 
-    Kube.OutboxModel {
-        id: outboxModel
+    MouseArea {
+        anchors.fill: parent
+        onClicked: {
+            dialog.visible = dialog.visible ? false : true
+        }
     }
 
-    Popup {
+    Kube.Popup {
         id: dialog
 
         height: content.height + Kirigami.Units.smallSpacing * 2