add orderSummaryLabel and couponCode

1 files changed, 79 insertions, 0 deletions

diff --git a/OrderSummary.ui.qml b/OrderSummary.ui.qml
index cb23c18..b503401 100644
--- a/OrderSummary.ui.qml
+++ b/OrderSummary.ui.qml
@@ -4,4 +4,83 @@ import QtQuick.Layouts 1.15
 
 ColumnLayout {
 
+		ColumnLayout {
+			Layout.alignment: Qt.AlignTop
+			ColumnLayout {
+				spacing: 24
+				Layout.fillWidth: true
+				Label {
+					id: oderSummaryTitle
+					text: qsTr("Order Summary")
+					font.family: "Roboto"
+					font.weight: Font.Medium
+					font.pointSize: 16
+					Layout.fillWidth: true
+				}
+
+				RowLayout {
+					Layout.fillWidth: true
+					Label {
+						id: transactionLabel
+						color: "#6c757d"
+						text: qsTr("Transaction code")
+						font.family: "Roboto"
+						font.weight: Font.Medium
+						font.pointSize: 16
+						Layout.fillWidth: true
+					}
+					Label {
+						id: transactionCode
+						text: qsTr("B0D123X")
+						horizontalAlignment: Text.AlignRight
+						font.family: "Roboto"
+						font.weight: Font.Medium
+						font.pointSize: 16
+						Layout.fillWidth: true
+					}
+				}
+				RowLayout {
+					Rectangle {
+						color: "#f5f7f9"
+						radius: 8
+						border.width: 0
+						Layout.fillWidth: true
+						implicitHeight: 40
+						RowLayout {
+							anchors.fill: parent
+							TextField {
+								id: couponCode
+								placeholderText: qsTr("Coupon code")
+								Layout.fillWidth: true
+								font.pixelSize: 16
+								font.family: "roboto"
+								Layout.fillWidth: true
+								Layout.fillHeight: true
+								background: Rectangle {
+									color: "transparent"
+								}
+							}
+							Button {
+								id: couponButton
+								contentItem: Text {
+									color: "#ffffff"
+									text: "Apply"
+									horizontalAlignment: Text.AlignHCenter
+									verticalAlignment: Text.AlignVCenter
+									font.weight: Font.Medium
+									font.family: "Roboto"
+									font.pointSize: 14
+								}
+								Layout.fillHeight: true
+								background: Rectangle {
+									color: "#066ac9"
+									border.width: 0
+									radius: 8
+								}
+							}
+						}
+					}
+				}
+			}
+		}
 }