qml: background flatbuttons within pages

electrum/gui/qml/components/ChannelDetails.qml

@@ -108,12 +108,14 @@ Pane {
                         Layout.fillWidth: true
                         Layout.preferredHeight: 1
                     }
-                    FlatButton {
+                    Pane {
-                        Layout.minimumWidth: implicitWidth
+                        background: Rectangle { color: Material.dialogColor }
-                        // icon.source: '../../icons/warning.png'
+                        padding: 0
-                        // icon.color: 'transparent'
+                        FlatButton {
-                        text: channeldetails.frozenForSending ? qsTr('Unfreeze') : qsTr('Freeze')
+                            Layout.minimumWidth: implicitWidth
-                        onClicked: channeldetails.freezeForSending()
+                            text: channeldetails.frozenForSending ? qsTr('Unfreeze') : qsTr('Freeze')
+                            onClicked: channeldetails.freezeForSending()
+                        }
                     }
                 }
 
@@ -143,12 +145,14 @@ Pane {
                         Layout.fillWidth: true
                         Layout.preferredHeight: 1
                     }
-                    FlatButton {
+                    Pane {
-                        Layout.minimumWidth: implicitWidth
+                        background: Rectangle { color: Material.dialogColor }
-                        // icon.source: '../../icons/warning.png'
+                        padding: 0
-                        // icon.color: 'transparent'
+                        FlatButton {
-                        text: channeldetails.frozenForReceiving ? qsTr('Unfreeze') : qsTr('Freeze')
+                            Layout.minimumWidth: implicitWidth
-                        onClicked: channeldetails.freezeForReceiving()
+                            text: channeldetails.frozenForReceiving ? qsTr('Unfreeze') : qsTr('Freeze')
+                            onClicked: channeldetails.freezeForReceiving()
+                        }
                     }
                 }
 

electrum/gui/qml/components/Preferences.qml

@@ -217,16 +217,23 @@ Pane {
                         }
                     }
 
-                    Button {
+                    Pane {
-                        text: qsTr('Modify')
+                        background: Rectangle { color: Material.dialogColor }
+                        padding: 0
                         visible: Config.pinCode != ''
-                        onClicked: {
+                        FlatButton {
-                            var dialog = pinSetup.createObject(preferences, {mode: 'change', pincode: Config.pinCode})
+                            text: qsTr('Modify')
-                            dialog.accepted.connect(function() {
+                            onClicked: {
-                                Config.pinCode = dialog.pincode
+                                var dialog = pinSetup.createObject(preferences, {
-                                dialog.close()
+                                    mode: 'change',
-                            })
+                                    pincode: Config.pinCode
-                            dialog.open()
+                                })
+                                dialog.accepted.connect(function() {
+                                    Config.pinCode = dialog.pincode
+                                    dialog.close()
+                                })
+                                dialog.open()
+                            }
                         }
                     }
 

electrum/gui/qml/components/TxDetails.qml

@@ -136,30 +136,38 @@ Pane {
                             }
                             ColumnLayout {
                                 Layout.alignment: Qt.AlignHCenter
-                                FlatButton {
+                                Pane {
-                                    id: feebumpButton
+                                    background: Rectangle { color: Material.dialogColor }
+                                    padding: 0
                                     visible: txdetails.canBump || txdetails.canCpfp
-                                    textUnderIcon: false
+                                    FlatButton {
-                                    icon.source: '../../icons/add.png'
+                                        id: feebumpButton
-                                    text: qsTr('Bump fee')
+                                        textUnderIcon: false
-                                    onClicked: {
+                                        icon.source: '../../icons/add.png'
-                                        if (txdetails.canBump) {
+                                        text: qsTr('Bump fee')
-                                            var dialog = rbfBumpFeeDialog.createObject(root, { txid: root.txid })
+                                        onClicked: {
-                                        } else {
+                                            if (txdetails.canBump) {
-                                            var dialog = cpfpBumpFeeDialog.createObject(root, { txid: root.txid })
+                                                var dialog = rbfBumpFeeDialog.createObject(root, { txid: root.txid })
+                                            } else {
+                                                var dialog = cpfpBumpFeeDialog.createObject(root, { txid: root.txid })
+                                            }
+                                            dialog.open()
                                         }
-                                        dialog.open()
                                     }
                                 }
-                                FlatButton {
+                                Pane {
-                                    id: cancelButton
+                                    background: Rectangle { color: Material.dialogColor }
+                                    padding: 0
                                     visible: txdetails.canCancel
-                                    textUnderIcon: false
+                                    FlatButton {
-                                    icon.source: '../../icons/closebutton.png'
+                                        id: cancelButton
-                                    text: qsTr('Cancel Tx')
+                                        textUnderIcon: false
-                                    onClicked: {
+                                        icon.source: '../../icons/closebutton.png'
-                                        var dialog = rbfCancelDialog.createObject(root, { txid: root.txid })
+                                        text: qsTr('Cancel Tx')
-                                        dialog.open()
+                                        onClicked: {
+                                            var dialog = rbfCancelDialog.createObject(root, { txid: root.txid })
+                                            dialog.open()
+                                        }
                                     }
                                 }
                             }