change composer layout according to mockup by ken

2 files changed, 69 insertions, 57 deletions

diff --git a/components/package/contents/ui/Composer.qml b/components/package/contents/ui/Composer.qml
index e8dc4e1a..05bad7d0 100644
--- a/components/package/contents/ui/Composer.qml
+++ b/components/package/contents/ui/Composer.qml
@@ -53,25 +53,23 @@ Item {
 
         anchors.fill: parent
 
-        GridLayout {
-
-            columns: 2
+        TextField {
+            id: subject
 
-            Kirigami.Label {
-                text: "From"
-            }
+            Layout.fillWidth: true
 
-            ComboBox {
-                id: identityCombo
-                model: composer.identityModel
-                textRole: "displayName"
+            placeholderText: "Enter Subject"
 
-                Layout.fillWidth: true
+            text: composer.subject
 
-                onCurrentIndexChanged: {
-                    composer.currentIdentityIndex = currentIndex
-                }
+            onTextChanged: {
+                composer.subject = text;
             }
+        }
+
+        GridLayout {
+
+            columns: 2
 
             Kirigami.Label {
                 text: "To"
@@ -91,28 +89,6 @@ Item {
                         composer.to = text;
                     }
                 }
-
-                Button {
-                    id: ccButton
-
-                    text: "Cc"
-
-                    onClicked: {
-                        cc.visible = true
-                        ccButton.visible = false
-                    }
-                }
-
-                Button {
-                    id: bccButton
-
-                    text: "Bcc"
-
-                    onClicked: {
-                        bcc.visible = true
-                        bccButton.visible = false
-                    }
-                }
             }
 
             Kirigami.Label {
@@ -131,7 +107,7 @@ Item {
                 text: composer.cc
 
                 onTextChanged: {
-                        composer.cc = text;
+                    composer.cc = text;
                 }
             }
 
@@ -151,43 +127,56 @@ Item {
                 text: composer.bcc
 
                 onTextChanged: {
-                        composer.bcc = text;
+                    composer.bcc = text;
                 }
             }
         }
 
-        TextField {
-            id: subject
-
-            Layout.fillWidth: true
+        RowLayout {
+            Kirigami.Label {
+                text: "Sending as"
+            }
 
-            placeholderText: "Enter Subject"
+            ComboBox {
+                id: identityCombo
+                model: composer.identityModel
+                textRole: "displayName"
 
-            text: composer.subject
+                Layout.fillWidth: true
 
-            onTextChanged: {
-                composer.subject = text;
+                onCurrentIndexChanged: {
+                    composer.currentIdentityIndex = currentIndex
+                }
             }
-        }
 
-        Item {
+            Button {
+                id: ccButton
 
-            Layout.fillWidth: true
+                text: "Cc"
 
-            height: subject.height * 1.5
+                onClicked: {
+                    cc.visible = true
+                    ccButton.visible = false
+                }
+            }
 
             Button {
+                id: bccButton
 
-                anchors {
-                    bottom: parent.bottom
-                }
-
-                text: "Save as Draft"
+                text: "Bcc"
 
                 onClicked: {
-                    composer.saveAsDraft()
+                    bcc.visible = true
+                    bccButton.visible = false
                 }
             }
+        }
+
+        Item {
+
+            Layout.fillWidth: true
+
+            height: subject.height * 1.5
 
             Button {
 
diff --git a/components/package/contents/ui/FocusComposer.qml b/components/package/contents/ui/FocusComposer.qml
index bbee1edc..9129dba9 100644
--- a/components/package/contents/ui/FocusComposer.qml
+++ b/components/package/contents/ui/FocusComposer.qml
@@ -52,7 +52,30 @@ KubeComponents.OverlayDialog {
             }
 
             RowLayout {
-                Layout.alignment: Qt.AlignRight
+
+                Button {
+
+                    text: "Discard"
+
+                    onClicked: {
+                        root.destroy()
+                    }
+                }
+
+                Item {
+                    Layout.fillWidth: true
+                }
+
+
+                Button {
+
+                    text: "Save as Draft"
+
+                    onClicked: {
+                        composer.saveAsDraft()
+                        root.destroy()
+                    }
+                }
 
                 Button {
                     text: "Send"