1 files changed, 116 insertions, 80 deletions

diff --git a/components/mail/contents/ui/main.qml b/components/mail/contents/ui/main.qml
index 72987d74..589faf30 100644
--- a/components/mail/contents/ui/main.qml
+++ b/components/mail/contents/ui/main.qml
@@ -65,10 +65,8 @@ ApplicationWindow {
         context: folderListContext
     }
 
-
-    ToolBar {
+    Item {
         id: toolbar
-
         anchors {
             top: app.top
             left: app.left
@@ -77,112 +75,150 @@ ApplicationWindow {
         height: Kirigami.Units.iconSizes.medium
         width: app.width
 
+        Rectangle {
+            anchors.bottom: parent.bottom
+            width: parent.width
+            height: 1
+            color: "grey"
+        }
 
         Row {
-            anchors {
-                left: parent.left
-                top: parent.top
-                bottom: parent.bottom
-            }
+            anchors.fill: parent
 
-            Component {
-                id: composerComponent
-                KubeComponents.FocusComposer {
-                    id: composer
-                    anchors.fill: parent
-                }
-            }
+            spacing: 1 //to account for the SplitView borders
 
-            ToolButton {
+            RowLayout {
                 height: parent.height
-                iconName: "view-refresh"
-                text: "Sync"
-                enabled: syncAction.ready
-                onClicked: {
-                    syncAction.execute()
+                width: folderListView.width
+                clip: true
+
+                ToolButton {
+                    Layout.fillHeight: true
+                    text: "Account/Project/Activity Switch"
+
+                    onClicked: {
+                        //TODO
+                    }
                 }
-            }
 
-            ToolButton {
-                height: parent.height
-                iconName: "mail-mark-unread"
-                text: "Mark As Read"
-                enabled: markAsReadAction.ready
-                onClicked: {
-                    markAsReadAction.execute()
+                ToolButton {
+                    Layout.fillHeight: true
+                    iconName: "view-refresh"
+                    text: "Sync"
+                    enabled: syncAction.ready
+
+                    onClicked: {
+                        syncAction.execute()
+                    }
                 }
             }
 
-            ToolButton {
+            RowLayout {
                 height: parent.height
-                iconName: "mail-mark-important"
-                text: "Mark Important"
-                enabled: false
-                onClicked: {
+                width: mailListView.width
+                clip: true
+
+                ToolButton {
+                    Layout.fillHeight: true
+                    iconName: "mail-mark-unread"
+                    text: "Mark As Read"
+                    enabled: markAsReadAction.ready
+                    onClicked: {
+                        markAsReadAction.execute()
+                    }
                 }
-            }
 
-            ToolButton {
-                height: parent.height
-                iconName: "edit-delete"
-                text: "Delete Mail"
-                enabled: deleteAction.ready
-                onClicked: {
-                    deleteAction.execute()
+                ToolButton {
+                    Layout.fillHeight: true
+                    iconName: "mail-mark-important"
+                    text: "Mark Important"
+                    enabled: false
+                    onClicked: {
+                    }
                 }
-            }
 
-            ToolButton {
-                height: parent.height
-                iconName: "mail-message-new"
-                text: "Compose"
-                onClicked: {
-                    composerComponent.createObject(app)
+                ToolButton {
+                    Layout.fillHeight: true
+                    iconName: "edit-delete"
+                    text: "Delete Mail"
+                    enabled: deleteAction.ready
+                    onClicked: {
+                        deleteAction.execute()
+                    }
                 }
-            }
 
-            ToolButton {
-                height: parent.height
-                iconName: "mail-message-reply"
-                text: "Reply"
-                onClicked: {
-                    composerComponent.createObject(app)
-                    composer.originalMessage = mailListView.currentMail
+                Item {
+                    Layout.fillWidth: true
                 }
             }
-        }
 
-        RowLayout {
-            anchors {
-                right: parent.right
-                verticalCenter: parent.verticalCenter
-            }
 
-            width: Kirigami.Units.gridUnit * 40
-            height: Kirigami.Units.iconSizes.medium
+            RowLayout{
+                height: parent.height
+                width: mailView.width
+                clip: true
 
-            TextField {
+                Component {
+                    id: composerComponent
 
-                Layout.fillWidth: true
+                    KubeComponents.FocusComposer {
+                        id: composer
+                        anchors.fill: parent
+                    }
+                }
 
-                placeholderText: "Search..."
-            }
+                ToolButton {
+                    id: newMailButton
 
-            ToolButton {
+                    Layout.fillHeight: true
 
-                height: Kirigami.Units.iconSizes.medium
+                    iconName: "mail-message-new"
+                    text: "Compose"
+                    onClicked: {
+                        composerComponent.createObject(app)
+                    }
+                }
 
-                iconName: "application-menu"
-                text: "Settings"
+                ToolButton {
+                    Layout.fillHeight: true
+                    iconName: "mail-message-reply"
+                    text: "Reply"
+                    onClicked: {
+                        composerComponent.createObject(app)
+                        composer.originalMessage = mailListView.currentMail
+                    }
+                }
 
-                onClicked: {
-                    settingsComponent.createObject(app)
+                Item {
+                    Layout.fillWidth: true
                 }
-                Component {
-                    id: settingsComponent
-                    KubeComponents.Settings {
-                        id: settings
-                        anchors.fill: parent
+
+                TextField {
+                    id: searchBar
+
+                    Layout.minimumWidth: Kirigami.Units.gridUnit * 25
+
+                    placeholderText: "Search..."
+                }
+
+                ToolButton {
+                    id: settingsButton
+
+                    Layout.fillHeight: true
+
+                    iconName: "application-menu"
+                    text: "Settings"
+
+                    onClicked: {
+                        settingsComponent.createObject(app)
+                    }
+
+                    Component {
+                        id: settingsComponent
+                        KubeComponents.Settings {
+                            id: settings
+                            anchors.fill: parent
+                        }
                     }
                 }
             }