The outbox is back

2 files changed, 16 insertions, 24 deletions

diff --git a/framework/qml/Icons.qml b/framework/qml/Icons.qml
index 8d63f021..ee706d95 100644
--- a/framework/qml/Icons.qml
+++ b/framework/qml/Icons.qml
@@ -39,6 +39,8 @@ Item {
     property string moveToTrash: "edit-delete"
     property string edit: "document-edit"
     property string replyToSender: "mail-reply-sender"
+    property string outbox: "mail-folder-outbox"
+    property string outbox_inverted: "mail-folder-outbox-inverted"
 
     property string menu_inverted: "application-menu-inverted"
     property string user_inverted: "im-user-inverted"
diff --git a/framework/qml/Outbox.qml b/framework/qml/Outbox.qml
index 43d0f102..fc960667 100644
--- a/framework/qml/Outbox.qml
+++ b/framework/qml/Outbox.qml
@@ -25,7 +25,7 @@ import org.kde.kirigami 1.0 as Kirigami
 import org.kube.framework 1.0 as Kube
 
 
-Rectangle {
+Controls.ToolButton {
     id: root
 
     visible: outboxModel.count > 0
@@ -36,42 +36,32 @@ Rectangle {
     Kube.OutboxModel {
         id: outboxModel
     }
+    iconName: Kube.Icons.outbox
 
     states: [
         State {
             name: "busy"; when: outboxModel.status == Kube.OutboxModel.InProgressStatus
-            PropertyChanges { target: icon; iconName: Kube.Icons.busy_inverted }
+            PropertyChanges { target: root; iconName: Kube.Icons.busy_inverted }
         },
         State {
             name: "error"; when: outboxModel.status == Kube.OutboxModel.ErrorStatus
-            PropertyChanges { target: icon; iconName: Kube.Icons.error_inverted }
+            PropertyChanges { target: root; iconName: Kube.Icons.error_inverted }
         }
     ]
 
-    color: Kube.Colors.textColor
-    clip: true
-
-    Row {
-        anchors.centerIn: parent
-        spacing: Kube.Units.smallSpacing
-        Kube.Label {
-            id: text
-            anchors.verticalCenter: parent.verticalCenter
-            text: outboxModel.count > 0 ? "Pending (" + outboxModel.count + ")" : "Outbox"
-            color: Kube.Colors.highlightedTextColor
-        }
-        Icon {
-            id: icon
-            anchors.verticalCenter: parent.verticalCenter
-            iconName: ""
-            visible: iconName != ""
+    Kube.Label {
+        id: text
+        anchors {
+            right: parent.right
+            bottom: parent.bottom
         }
+        width: Kube.Units.smallSpacing
+        text: outboxModel.count
+        color: Kube.Colors.disabledTextColor
+        font.pointSize: 9
     }
 
-    MouseArea {
-        anchors.fill: parent
-        onClicked: dialog.open()
-    }
+    onClicked: dialog.open()
 
     Kube.Popup {
         id: dialog