Refactor Init error window to fit to design spec (2/4)

src/Makefile.qt.include

@@ -329,6 +329,7 @@ QML_RES_QML = \
   qml/controls/OnboardingNav.qml \
   qml/controls/OptionButton.qml \
   qml/controls/OptionSwitch.qml \
+  qml/controls/OutlineButton.qml \
   qml/controls/ProgressIndicator.qml \
   qml/controls/qmldir \
   qml/controls/Setting.qml \

src/qml/bitcoin.cpp

@@ -67,6 +67,7 @@ bool InitErrorMessageBox(
 {
     QQmlApplicationEngine engine;
     engine.rootContext()->setContextProperty("message", QString::fromStdString(message.translated));
+    engine.addImageProvider(QStringLiteral("images"), new ImageProvider{NULL});
     engine.load(QUrl(QStringLiteral("qrc:///qml/pages/initerrormessage.qml")));
     if (engine.rootObjects().isEmpty()) {
         return EXIT_FAILURE;

src/qml/bitcoin_qml.qrc

@@ -17,6 +17,7 @@
         <file>controls/OnboardingNav.qml</file>
         <file>controls/OptionButton.qml</file>
         <file>controls/OptionSwitch.qml</file>
+        <file>controls/OutlineButton.qml</file>
         <file>controls/ProgressIndicator.qml</file>
         <file>controls/qmldir</file>
         <file>controls/Setting.qml</file>

src/qml/controls/OutlineButton.qml

@@ -0,0 +1,29 @@
+// Copyright (c) 2022 The Bitcoin Core developers
+// Distributed under the MIT software license, see the accompanying
+// file COPYING or http://www.opensource.org/licenses/mit-license.php.
+
+import QtQuick 2.15
+import QtQuick.Controls 2.15
+
+Button {
+    font.family: "Inter"
+    font.styleName: "Semi Bold"
+    font.pixelSize: 18
+    contentItem: Text {
+        text: parent.text
+        font: parent.font
+        color: Theme.color.neutral9
+        horizontalAlignment: Text.AlignHCenter
+        verticalAlignment: Text.AlignVCenter
+    }
+    background: Rectangle {
+        implicitHeight: 46
+        implicitWidth: 340
+        color: Theme.color.background
+        radius: 5
+        border {
+            width: 1
+            color: Theme.color.neutral4
+        }
+    }
+}

src/qml/pages/initerrormessage.qml

@@ -4,22 +4,82 @@
 
 import QtQuick 2.15
 import QtQuick.Controls 2.15
+import QtQuick.Layouts 1.15
+import "../controls"
 
 ApplicationWindow {
-    title: "Bitcoin Core TnG"
+    id: root
     visible: true
     minimumWidth: 500
-    minimumHeight: 200
+    minimumHeight: 320
+    color: "transparent"
+    flags: Qt.FramelessWindowHint
+    background: Rectangle {
+      color: Theme.color.background
+      radius: 10
+    }
+    menuBar: RowLayout {
+        width: parent.width
+        height: 55
+
+        DragHandler {
+          id: menuHandler
+          grabPermissions: TapHandler.CanTakeOverFromAnything
+          onActiveChanged: if (active) { root.startSystemMove(); }
+          target: null
+        }
+        Rectangle {
+            width: 55
+        }
+        Header {
+            Layout.fillWidth: true
+            Layout.alignment: Qt.AlignCenter
+            bold: true
+            header: "Bitcoin Core App"
+            headerSize: 24
+        }
+        Button {
+            id: icon_button
+            implicitWidth: 55
+            icon.source: "image://images/cross"
+            icon.color: Theme.color.neutral9
+            icon.width: 20
+            background: null
+            onClicked: Qt.quit()
+        }
+    }
+
+    DragHandler {
+      id: moveHandler
+      grabPermissions: TapHandler.CanTakeOverFromAnything
+      onActiveChanged: if (active) { root.startSystemMove(); }
+      target: null
+    }
+    Rectangle {
+        anchors.bottom: root.menuBar.bottom
+        width: root.width
+        height: 1
+        color: Theme.color.neutral5
+    }
+    ColumnLayout {
+        spacing: 30
+        anchors.top: parent.top
+        anchors.horizontalCenter: parent.horizontalCenter
 
-    Dialog {
-        anchors.centerIn: parent
-        title: qsTr("Error")
-        contentItem:
-            Label {
-                text: message
-            }
-        visible: true
-        standardButtons: Dialog.Ok
-        onAccepted: Qt.quit()
+        Header {
+            Layout.topMargin: 30
+            Layout.fillWidth: true
+            bold: true
+            header: "There was a problem starting up."
+            headerSize: 24
+            description: message
+            descriptionSize: 18
+            descriptionMargin: 5
+        }
+        OutlineButton {
+            Layout.alignment: Qt.AlignCenter
+            text: "Quit"
+            onClicked: Qt.quit()
+        }
     }
 }