[dialer] Fix the dialer layout

It moves the buttons in the RowLayout below the GridLayout into the
GridLayout itself; that fixes the overall width of the main layout and
everything gets nicely centered.

Plus some minor layout changes.

dialer/package/contents/ui/Dialer/DialPage.qml

@@ -24,12 +24,12 @@ import org.kde.plasma.components 2.0 as PlasmaComponents
 
 Column {
     spacing: 0
+    anchors.fill: parent
+
     PlasmaComponents.TabGroup {
-        anchors {
-            left: parent.left
-            right: parent.right
-        }
         height: parent.height - tabbar.height
+        width: parent.width
+
         History {
             id: history
         }
@@ -43,10 +43,8 @@ Column {
     PlasmaComponents.TabBar {
         id: tabbar
         height: units.gridUnit * 5
-        anchors {
+        width: parent.width
-            left: parent.left
+
-            right: parent.right
-        }
         tabPosition: Qt.BottomEdge
         PlasmaComponents.TabButton {
             iconSource: "view-history"

dialer/package/contents/ui/Dialer/Dialer.qml

@@ -42,11 +42,13 @@ Item {
             fill: parent
             margins: units.largeSpacing
         }
+
         PlasmaComponents.Label {
             id: status
             Layout.fillWidth: true
             Layout.minimumHeight: parent.height / 6
             Layout.maximumHeight: Layout.minimumHeight
+
             horizontalAlignment: Qt.AlignRight
             verticalAlignment: Qt.AlignVCenter
             font.pointSize: 1024
@@ -64,41 +66,5 @@ Item {
                 ofonoWrapper.stopTone();
             }
         }
-
-        RowLayout {
-            Layout.fillWidth: true
-            Layout.minimumHeight: parent.height / 6
-            Layout.maximumHeight: Layout.minimumHeight
-            DialerIconButton {
-                id: callButton
-                Layout.minimumWidth: dialPadArea.width/3
-                Layout.fillWidth: true
-                Layout.fillHeight: true
-                enabled: status.text.length > 0
-                opacity: enabled ? 1 : 0.5
-                source: "call-start"
-                callback: function() {
-                    call(status.text);
-                }
-            }
-            Item {
-                Layout.minimumWidth: dialPadArea.width/3
-                Layout.fillWidth: true
-                Layout.fillHeight: true
-            }
-            DialerIconButton {
-                Layout.fillWidth: true
-                Layout.fillHeight: true
-                Layout.minimumWidth: dialPadArea.width/3
-                enabled: status.text.length > 0
-                opacity: enabled ? 1 : 0.5
-                source: "edit-clear"
-                callback: function(text) {
-                    if (status.text.length > 0) {
-                        status.text = status.text.substr(0, status.text.length - 1);
-                    }
-                }
-            }
-        }
     }
 }

dialer/package/contents/ui/Dialpad/DialerButton.qml

@@ -111,15 +111,15 @@ PlasmaComponents.Label {
         anchors {
             verticalCenter: parent.verticalCenter
             right: parent.right
-            rightMargin: units.largeSpacing
+            rightMargin: units.smallSpacing
         }
         height: parent.height * 0.4
-        width: parent.width / 4
+        width: parent.width / 3
         verticalAlignment: Qt.AlignVCenter
+        horizontalAlignment: Qt.AlignHCenter
         visible: text.length > 0
         opacity: 0.6
 
-        font.pointSize: 1024
         fontSizeMode: Text.Fit
     }
 }

dialer/package/contents/ui/Dialpad/Dialpad.qml

@@ -51,5 +51,36 @@ GridLayout {
     DialerButton { text: "*"; } 
     DialerButton { text: "0"; sub: "+"; }
     DialerButton { text: "#" }
-}
 
+    DialerIconButton {
+        id: callButton
+        Layout.fillWidth: true
+        Layout.fillHeight: true
+        Layout.minimumHeight: buttonHeight
+
+        enabled: status.text.length > 0
+        opacity: enabled ? 1 : 0.5
+        source: "call-start"
+        callback: function() {
+            call(status.text);
+        }
+    }
+    Item {
+        Layout.fillWidth: true
+        Layout.fillHeight: true
+    }
+    DialerIconButton {
+        Layout.fillWidth: true
+        Layout.fillHeight: true
+        Layout.minimumHeight: buttonHeight
+
+        enabled: status.text.length > 0
+        opacity: enabled ? 1 : 0.5
+        source: "edit-clear"
+        callback: function(text) {
+            if (status.text.length > 0) {
+                status.text = status.text.substr(0, status.text.length - 1);
+            }
+        }
+    }
+}

dialer/package/contents/ui/main.qml

@@ -29,7 +29,7 @@ ApplicationWindow {
     id: root
 
 //BEGIN PROPERTIES
-    width: 600
+    width: 1080
     height: 800
 
     //keep track if we were visible when ringing