Merge bitcoin-core/gui-qml#484: Fix layout issues in ExternalPopup.qml

8c7f2cbf399c42241af4cb00c2807bca9ff232c2 Fix layout issues in ExternalPopup.qml (johnny9)

Pull request description:

  Simplifies the layout in ExternalPopup by using CoreText instead of Navigation bar for the title, removing an extra ColumnLayout, and using GridLayout to handle the difference between mobile and desktop.

  This resolves the "Qt Quick Layouts: Polish loop detected" warning.

  Fixes #483

ACKs for top commit:
  hebasto:
    ACK 8c7f2cbf399c42241af4cb00c2807bca9ff232c2, tested on Ubuntu 24.04.

Tree-SHA512: 556b3c334b330a5db10f44e34e857a1d2a07784ca1eaae6af6e6b456b752bf7a9f40f8b5d34a2ef8d6aae69c1e67ca94f9b588e68fcfb04ceae39e34f43d4306

Author: tx-signer450

qml/components/ExternalPopup.qml

@@ -14,6 +14,7 @@ Popup {
     property string link: ""
     modal: true
     padding: 0
+    anchors.centerIn: parent
 
     background: Rectangle {
         color: Theme.color.background
@@ -24,86 +25,50 @@ Popup {
         anchors.fill: parent
         spacing: 0
 
-        NavigationBar {
+        CoreText {
+            Layout.fillWidth: true
             Layout.preferredHeight: 55
-            middleDetail: Header {
-                Layout.fillWidth: true
-                header: qsTr("External Link")
-                headerBold: true
-                headerSize: 24
-            }
+            text: qsTr("External Link")
+            bold: true
+            font.pixelSize: 24
+            horizontalAlignment: Text.AlignHCenter
+            verticalAlignment: Text.AlignVCenter
         }
 
         Separator {
             Layout.fillWidth: true
         }
 
-        ColumnLayout {
-            id: popupContent
+        Header {
             Layout.fillWidth: true
-            Layout.rightMargin: 20
-            Layout.leftMargin: 20
+            Layout.margins: 20
             Layout.topMargin: 20
-            Layout.bottomMargin: 20
-            spacing: 30
-            Header {
-                Layout.fillWidth: true
-                header: qsTr("Do you want to open the following website in your browser?")
-                headerBold: false
-                headerSize: 18
-                description: ("\"" + externalConfirmPopup.link + "\"")
-                descriptionMargin: 3
-            }
-            Loader {
-                id: layoutLoader
-                Layout.fillWidth: true
-                sourceComponent: AppMode.isDesktop ? desktopLayout : mobileLayout
-            }
+            header: qsTr("Do you want to open the following website in your browser?")
+            headerBold: false
+            headerSize: 16
+            description: ("\"" + externalConfirmPopup.link + "\"")
+            descriptionMargin: 8
         }
-    }
 
-    Component {
-        id: desktopLayout
-        RowLayout {
+        GridLayout {
             Layout.fillWidth: true
-            spacing: 15
-            OutlineButton {
-                text: qsTr("Cancel")
-                Layout.fillWidth: true
-                Layout.minimumWidth: 150
-                onClicked: {
-                    externalConfirmPopup.close()
-                }
-            }
-            ContinueButton {
-                text: qsTr("Ok")
-                Layout.fillWidth: true
-                Layout.minimumWidth: 150
-                onClicked: {
-                    Qt.openUrlExternally(externalConfirmPopup.link)
-                    externalConfirmPopup.close()
-                }
-            }
-        }
-    }
+            Layout.margins: 20
+            Layout.topMargin: 0
+            columns: AppMode.isDesktop ? 2 : 1
+            columnSpacing: 15
+            rowSpacing: 10
 
-    Component {
-        id: mobileLayout
-        ColumnLayout {
-            Layout.fillWidth: true
-            spacing: 15
             OutlineButton {
                 text: qsTr("Cancel")
                 Layout.fillWidth: true
-                Layout.minimumWidth: 150
-                onClicked: {
-                    externalConfirmPopup.close()
-                }
+                Layout.minimumWidth: 120
+                onClicked: externalConfirmPopup.close()
             }
+
             ContinueButton {
                 text: qsTr("Ok")
                 Layout.fillWidth: true
-                Layout.minimumWidth: 150
+                Layout.minimumWidth: 120
                 onClicked: {
                     Qt.openUrlExternally(externalConfirmPopup.link)
                     externalConfirmPopup.close()