qml: styling TxDetails

electrum/gui/qml/components/TxDetails.qml

@@ -11,8 +11,7 @@ Pane {
     id: root
     width: parent.width
     height: parent.height
-
-    // property string title: qsTr("Transaction details")
+    padding: 0
 
     property string txid
     property string rawtx
@@ -25,68 +24,23 @@ Pane {
         app.stack.pop()
     }
 
-    property QtObject menu: Menu {
-        id: menu
-        parent: Overlay.overlay
-        dim: true
-        Overlay.modeless: Rectangle {
-            color: "#44000000"
-        }
-        MenuItem {
-            icon.color: 'transparent'
-            action: Action {
-                text: qsTr('Export')
-                onTriggered: {
-                    var dialog = exportTxDialog.createObject(root, { txdetails: txdetails })
-                    dialog.open()
-                }
-            }
-        }
-        MenuItem {
-            icon.color: 'transparent'
-            action: Action {
-                text: qsTr('Bump fee')
-                enabled: txdetails.canBump
-                onTriggered: {
-                    var dialog = bumpFeeDialog.createObject(root, { txid: root.txid })
-                    dialog.open()
-                }
-            }
-        }
-        MenuItem {
-            icon.color: 'transparent'
-            action: Action {
-                text: qsTr('Child pays for parent')
-                enabled: txdetails.canCpfp
-                onTriggered: notificationPopup.show('Not implemented')
-            }
-        }
-        MenuItem {
-            icon.color: 'transparent'
-            action: Action {
-                text: qsTr('Cancel double-spend')
-                enabled: txdetails.canCancel
-                onTriggered: notificationPopup.show('Not implemented')
-            }
-        }
-        MenuItem {
-            icon.color: 'transparent'
-            action: Action {
-                text: qsTr('Remove')
-                enabled: txdetails.canRemove
-                onTriggered: txdetails.removeLocalTx()
-            }
-        }
-    }
+    ColumnLayout {
+        anchors.fill: parent
+        spacing: 0
 
         Flickable {
-        anchors.fill: parent
-        contentHeight: rootLayout.height
+            Layout.fillWidth: true
+            Layout.fillHeight: true
+            Layout.topMargin: constants.paddingLarge
+            Layout.leftMargin: constants.paddingLarge
+            Layout.rightMargin: constants.paddingLarge
+
+            contentHeight: contentLayout.height
             clip: true
             interactive: height < contentHeight
 
             GridLayout {
-            id: rootLayout
+                id: contentLayout
                 width: parent.width
                 columns: 2
 
@@ -377,24 +331,56 @@ Pane {
                         }
                     }
                 }
+            }
+
+        }
 
         RowLayout {
             visible: !txdetails.isMined && !txdetails.isUnrelated
-                Layout.columnSpan: 2
-                Button {
+            FlatButton {
+                Layout.fillWidth: true
+                Layout.preferredWidth: 1
                 text: qsTr('Sign')
                 enabled: txdetails.canSign
                 onClicked: txdetails.sign()
             }
-                Button {
+            FlatButton {
+                Layout.fillWidth: true
+                Layout.preferredWidth: 1
                 text: qsTr('Broadcast')
                 enabled: txdetails.canBroadcast
                 onClicked: txdetails.broadcast()
             }
         }
+
+        FlatButton {
+            Layout.fillWidth: true
+            text: qsTr('Export')
+            onClicked: {
+                var dialog = exportTxDialog.createObject(root, { txdetails: txdetails })
+                dialog.open()
             }
         }
 
+        FlatButton {
+            Layout.fillWidth: true
+            text: qsTr('Bump fee')
+            visible: txdetails.canBump
+            onClicked: {
+                var dialog = bumpFeeDialog.createObject(root, { txid: root.txid })
+                dialog.open()
+            }
+        }
+
+        FlatButton {
+            Layout.fillWidth: true
+            text: qsTr('Remove')
+            visible: txdetails.canRemove
+            onClicked: txdetails.removeLocalTx()
+        }
+
+    }
+
     TxDetails {
         id: txdetails
         wallet: Daemon.currentWallet