Login alert on checkout

1 files changed, 109 insertions, 92 deletions

diff --git a/CheckoutFlickable.ui.qml b/CheckoutFlickable.ui.qml
index c871462..a3800b5 100644
--- a/CheckoutFlickable.ui.qml
+++ b/CheckoutFlickable.ui.qml
@@ -3,6 +3,7 @@ import QtQuick.Controls 2.15
 import QtQuick.Layouts 1.15
 
 Flickable {
+	property alias checkoutLogin: login
 	contentHeight: personal.height
 
 	Item {
@@ -13,117 +14,133 @@ Flickable {
 			right: parent.right
 		}
 
-		GridLayout {
-			ColumnLayout {
-				Label {
-					text: qsTr("Your name *")
-					Layout.fillWidth: true
-				}
-				TextField {
-					placeholderText: qsTr("Name")
-					Layout.fillWidth: true
-				}
+		ColumnLayout {
 
-				Layout.topMargin: 16
-				Layout.leftMargin: 8
-				Layout.rightMargin: 8
-			}
-
-			ColumnLayout {
+			RowLayout {
+				Layout.alignment: Qt.AlignHCenter
 				Label {
-					text: qsTr("Email address *")
-					Layout.fillWidth: true
+					text: qsTr("Already have an account?")
 				}
-				TextField {
-					placeholderText: qsTr("Email")
-					Layout.fillWidth: true
+				Text {
+					id: login
+					text: "<a href=\"sign-in.html\">Log in"
+					+ "</a>"
+					font.underline: false
 				}
-
-				Layout.topMargin: 16
-				Layout.leftMargin: 8
-				Layout.rightMargin: 8
 			}
 
-			ColumnLayout {
-				Label {
-					text: qsTr("Mobile number *")
-					Layout.fillWidth: true
+			GridLayout {
+				ColumnLayout {
+					Label {
+						text: qsTr("Your name *")
+						Layout.fillWidth: true
+					}
+					TextField {
+						placeholderText: qsTr("Name")
+						Layout.fillWidth: true
+					}
+
+					Layout.topMargin: 16
+					Layout.leftMargin: 8
+					Layout.rightMargin: 8
 				}
-				TextField {
-					placeholderText: qsTr("Mobile number")
-					Layout.fillWidth: true
-				}
-
-				Layout.topMargin: 16
-				Layout.leftMargin: 8
-				Layout.rightMargin: 8
-			}
 
-			ColumnLayout {
-				Label {
-					text: qsTr("Select country *")
-					Layout.fillWidth: true
-				}
-				TextField {
-					placeholderText: qsTr("Select country")
-					Layout.fillWidth: true
+				ColumnLayout {
+					Label {
+						text: qsTr("Email address *")
+						Layout.fillWidth: true
+					}
+					TextField {
+						placeholderText: qsTr("Email")
+						Layout.fillWidth: true
+					}
+
+					Layout.topMargin: 16
+					Layout.leftMargin: 8
+					Layout.rightMargin: 8
 				}
 
-				Layout.topMargin: 16
-				Layout.leftMargin: 8
-				Layout.rightMargin: 8
-			}
-
-			ColumnLayout {
-				Label {
-					text: qsTr("Select state *")
-					Layout.fillWidth: true
-				}
-				TextField {
-					placeholderText: qsTr("Select state")
-					Layout.fillWidth: true
+				ColumnLayout {
+					Label {
+						text: qsTr("Mobile number *")
+						Layout.fillWidth: true
+					}
+					TextField {
+						placeholderText: qsTr("Mobile number")
+						Layout.fillWidth: true
+					}
+
+					Layout.topMargin: 16
+					Layout.leftMargin: 8
+					Layout.rightMargin: 8
 				}
 
-				Layout.topMargin: 16
-				Layout.leftMargin: 8
-				Layout.rightMargin: 8
-			}
-
-			ColumnLayout {
-				Label {
-					text: qsTr("Postal code *")
-					Layout.fillWidth: true
-				}
-				TextField {
-					placeholderText: qsTr("PIN code")
-					Layout.fillWidth: true
+				ColumnLayout {
+					Label {
+						text: qsTr("Select country *")
+						Layout.fillWidth: true
+					}
+					TextField {
+						placeholderText: qsTr("Select country")
+						Layout.fillWidth: true
+					}
+
+					Layout.topMargin: 16
+					Layout.leftMargin: 8
+					Layout.rightMargin: 8
 				}
 
-				Layout.topMargin: 16
-				Layout.leftMargin: 8
-				Layout.rightMargin: 8
-			}
+				ColumnLayout {
+					Label {
+						text: qsTr("Select state *")
+						Layout.fillWidth: true
+					}
+					TextField {
+						placeholderText: qsTr("Select state")
+						Layout.fillWidth: true
+					}
+
+					Layout.topMargin: 16
+					Layout.leftMargin: 8
+					Layout.rightMargin: 8
+				}
 
-			ColumnLayout {
-				Label {
-					text: qsTr("Address *")
-					Layout.fillWidth: true
+				ColumnLayout {
+					Label {
+						text: qsTr("Postal code *")
+						Layout.fillWidth: true
+					}
+					TextField {
+						placeholderText: qsTr("PIN code")
+						Layout.fillWidth: true
+					}
+
+					Layout.topMargin: 16
+					Layout.leftMargin: 8
+					Layout.rightMargin: 8
 				}
-				TextField {
-					placeholderText: qsTr("Address")
-					Layout.fillWidth: true
+
+				ColumnLayout {
+					Label {
+						text: qsTr("Address *")
+						Layout.fillWidth: true
+					}
+					TextField {
+						placeholderText: qsTr("Address")
+						Layout.fillWidth: true
+					}
+
+					Layout.topMargin: 16
+					Layout.leftMargin: 8
+					Layout.rightMargin: 8
 				}
 
-				Layout.topMargin: 16
-				Layout.leftMargin: 8
-				Layout.rightMargin: 8
+				width: parent.width
+				columns: width < 786 ? 1 : 2
+				rows: width < 786 ? 4 : 7
+				columnSpacing: 0
+				rowSpacing: 0
 			}
-
-			width: parent.width
-			columns: width < 786 ? 1 : 2
-			rows: width < 786 ? 4 : 7
-			columnSpacing: 0
-			rowSpacing: 0
 		}
 	}
 }