qml: Added onboarding03.qml

- The page correponds to the block clock page in design file.
- The block clock is temporarily replaced with the Bitcoin core app icon

Github-Pull: bitcoin-core#124
Rebased-From: a1bf658

Author: shaavan

src/qml/BitcoinApp/CMakeLists.txt

@@ -19,6 +19,7 @@ qt6_add_qml_module(bitcoin_qml
     onboarding01b.qml
     onboarding01c.qml
     onboarding02.qml
+    onboarding03.qml
     stub.qml
   RESOURCES
     ${PROJECT_SOURCE_DIR}/src/qt/res/icons/bitcoin.png

src/qml/BitcoinApp/onboarding03.qml

@@ -0,0 +1,77 @@
+// 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
+import QtQuick.Controls
+import QtQuick.Layouts
+import BitcoinApp.Controls
+
+Page {
+    background: null
+    clip: true
+    Layout.fillWidth: true
+    header: RowLayout {
+        height: 50
+        Layout.leftMargin: 10
+        Loader {
+            active: true
+            visible: active
+            sourceComponent: Item {
+                width: 73
+                height: 46
+                RowLayout {
+                    anchors.fill: parent
+                    spacing: 0
+                    Image {
+                        source: ":/qt/qml/BitcoinApp/res/icons/caret-left.png"
+                        mipmap: true
+                        Layout.preferredWidth: 30
+                        Layout.preferredHeight: 30
+                        Layout.alignment: Qt.AlignVCenter
+                        fillMode: Image.PreserveAspectFit
+                    }
+                    Text {
+                        Layout.alignment: Qt.AlignVCenter
+                        text: "Back"
+                        color: Theme.color.neutral9
+                        font.family: "Inter"
+                        font.styleName: "Semi Bold"
+                        font.pixelSize: 18
+                    }
+                }
+                MouseArea {
+                    anchors.fill: parent
+                    onClicked: swipeView.currentIndex -= 1
+                }
+            }
+        }
+    }
+    ColumnLayout {
+        width: 600
+        spacing: 0
+        anchors.top: parent.top
+        anchors.horizontalCenter: parent.horizontalCenter
+        Image {
+            Layout.topMargin: 20
+            Layout.alignment: Qt.AlignCenter
+            source: "image://images/app"
+            sourceSize.width: 200
+            sourceSize.height: 200
+        }
+        Header {
+            Layout.fillWidth: true
+            bold: true
+            header: qsTr("The block clock")
+            headerMargin: 30
+            description: qsTr("The Bitcoin network targets a new block every\n10 minutes. Sometimes it's faster and sometimes slower.\n\nThe block clock indicates each block on a dial\nthat represents the current day.")
+            descriptionMargin: 20
+        }
+        ContinueButton {
+            Layout.alignment: Qt.AlignCenter
+            Layout.topMargin: 40
+            text: "Next"
+            onClicked: swipeView.incrementCurrentIndex()
+        }
+    }
+}