Merge branch 'master' of darapsa.co.id:~anata/qeduport

8 files changed, 285 insertions, 11 deletions

diff --git a/CardItemGrid.ui.qml b/CardItemGrid.ui.qml
index 56dae24..1b82fbe 100644
--- a/CardItemGrid.ui.qml
+++ b/CardItemGrid.ui.qml
@@ -16,10 +16,6 @@ Item {
 	Rectangle {
 		id: cardItem
 		anchors.fill: parent
-		anchors.rightMargin: 16
-		anchors.leftMargin: 16
-		anchors.bottomMargin: 16
-		anchors.topMargin: 16
 		Layout.minimumWidth: 300
 		Layout.minimumHeight: 475
 		radius: 8
@@ -95,6 +91,7 @@ Item {
 						height: 24
 						text: qsTr("Button")
 						anchors.right: parent.right
+						checkable: true
 						anchors.rightMargin: 0
 						padding: 0
 						rightPadding: 0
@@ -107,7 +104,7 @@ Item {
 
 						Connections {
 							target: favorite
-							onClicked: item1.state = "favorite pressed"
+							onStateChanged: favorite.state = "favorite checked"
 						}
 					}
 				}
@@ -115,7 +112,7 @@ Item {
 
 			Label {
 				id: cardTitle
-				color: "#24292d"
+				color: "#000000"
 				text: qsTr("Course title")
 				wrapMode: Text.Wrap
 				Layout.fillWidth: true
@@ -126,22 +123,145 @@ Item {
 				Layout.rightMargin: 20
 				Layout.leftMargin: 20
 			}
+
+			RowLayout {
+				id: ratingStar
+				Layout.topMargin: 0
+				spacing: 8
+				Layout.fillWidth: false
+				Layout.margins: 20
+				Layout.rightMargin: 20
+				Layout.leftMargin: 20
+
+				Button {
+					id: star
+					padding: 0
+					rightPadding: 0
+					leftPadding: 0
+					bottomPadding: 0
+					topPadding: 0
+					icon.color: "#80000000"
+					flat: true
+					icon.source: "Material/svg/outlined/star.svg"
+					autoRepeat: false
+					checkable: true
+					display: AbstractButton.IconOnly
+					Layout.maximumHeight: 20
+					Layout.maximumWidth: 20
+					Layout.minimumHeight: 20
+					Layout.minimumWidth: 20
+					Layout.preferredHeight: 20
+					Layout.preferredWidth: 20
+
+					Connections {
+						target: star
+						onStateChanged: star.state = "star checked"
+					}
+				}
+				Label {
+					id: listInlineItemRating
+					color: "#000000"
+					text: "4.0/5/0"
+					font.pointSize: 14
+					font.family: "Roboto"
+					Layout.fillWidth: false
+				}
+			}
+
+			ColumnLayout {
+				id: cardFooter
+				spacing: 8
+				Rectangle {
+					id: cardFooterBorder
+					color: "#dde0e3"
+					border.color: "#dde0e3"
+					border.width: 0
+					Layout.rightMargin: 20
+					Layout.leftMargin: 20
+					Layout.preferredHeight: 1
+					Layout.minimumHeight: 1
+					Layout.fillWidth: true
+				}
+
+				RowLayout {
+					id: cardFooterContent
+					spacing: 8
+					Layout.margins: 20
+					Layout.rightMargin: 20
+					Layout.leftMargin: 20
+
+					RowLayout {
+						id: cardFooterTimer
+						Layout.fillWidth: true
+						spacing: 8
+						Image {
+							id: timerIcon
+							source: "Material/svg/outlined/schedule.svg"
+							sourceSize.height: 16
+							sourceSize.width: 16
+							ColorOverlay {
+								anchors.fill: timerIcon
+								source: timerIcon
+								color: "#d6293e"
+							}
+						}
+
+						Label {
+							color: "#000000"
+							text: "12h 56m"
+							font.family: "Roboto"
+							font.pointSize: 14
+							font.styleName: "Regular"
+						}
+					}
+
+					RowLayout {
+						id: cardFooterLecturers
+						Layout.fillWidth: true
+						spacing: 8
+						Image {
+							id: lecturersIcon
+							source: "Material/svg/outlined/table.svg"
+							sourceSize.height: 16
+							sourceSize.width: 16
+							ColorOverlay {
+								anchors.fill: lecturersIcon
+								source: lecturersIcon
+								color: "#fd7e14"
+							}
+						}
+
+						Label {
+							color: "#000000"
+							text: "12h 56m"
+							font.family: "Roboto"
+							font.pointSize: 14
+							font.styleName: "Regular"
+						}
+					}
+				}
+			}
 		}
 	}
 	states: [
 		State {
-			name: "favorite pressed"
-			when: favorite.pressed
+			name: "favorite checked"
+			when: favorite.checked
 
 			PropertyChanges {
 				target: favorite
 				icon.color: "#d6293e"
-				icon.source: "Font-Awesome/svgs/solid/heart.svg"
+				icon.source: "Material/svg/filled/heart.svg"
 			}
+		},
+		State {
+			name: "rating checked"
+			when: star.checked
 
 			PropertyChanges {
-				target: favorite
-				layer.enabled: true
+				target: star
+				icon.color: "#f7c32e"
+				icon.source: "Material/svg/filled/star.svg"
 			}
 		}
 	]
diff --git a/Material/svg/filled/schedule.svg b/Material/svg/filled/schedule.svg
new file mode 100644
index 0000000..e4f2d50
--- /dev/null
+++ b/Material/svg/filled/schedule.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="48" width="48"><path d="m31.35 33.65 2.25-2.25-7.95-8V13.35h-3V24.6ZM24 44q-4.1 0-7.75-1.575-3.65-1.575-6.375-4.3-2.725-2.725-4.3-6.375Q4 28.1 4 24t1.575-7.75q1.575-3.65 4.3-6.375 2.725-2.725 6.375-4.3Q19.9 4 24 4t7.75 1.575q3.65 1.575 6.375 4.3 2.725 2.725 4.3 6.375Q44 19.9 44 24t-1.575 7.75q-1.575 3.65-4.3 6.375-2.725 2.725-6.375 4.3Q28.1 44 24 44Z"/></svg>
\ No newline at end of file
diff --git a/Material/svg/filled/star.svg b/Material/svg/filled/star.svg
new file mode 100644
index 0000000..baf7068
--- /dev/null
+++ b/Material/svg/filled/star.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="48" width="48"><path d="m24 36.55-9.3 5.6q-.4.25-.85.225-.45-.025-.8-.275-.35-.25-.525-.65-.175-.4-.075-.9l2.45-10.6-8.2-7.15q-.4-.35-.475-.775-.075-.425.025-.825.1-.4.45-.675t.85-.325l10.85-.95 4.2-10q.2-.45.6-.675.4-.225.8-.225t.8.225q.4.225.6.675l4.2 10 10.85.95q.5.05.85.325t.45.675q.1.4.025.825-.075.425-.475.775l-8.2 7.15 2.45 10.6q.1.5-.075.9t-.525.65q-.35.25-.8.275-.45.025-.85-.225Z"/></svg>
\ No newline at end of file
diff --git a/Material/svg/filled/table.svg b/Material/svg/filled/table.svg
new file mode 100644
index 0000000..ac2ca77
--- /dev/null
+++ b/Material/svg/filled/table.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="48" width="48"><path d="M6 16.05V9q0-1.25.875-2.125T9 6h32q1.25 0 2.125.875T44 9v7.05Zm10.5 3v22.9H9q-1.25 0-2.125-.875T6 38.95v-19.9Zm17 0H44v19.9q0 1.25-.875 2.125T41 41.95h-7.5Zm-3 0v22.9h-11v-22.9Z"/></svg>
\ No newline at end of file
diff --git a/Material/svg/outlined/schedule.svg b/Material/svg/outlined/schedule.svg
new file mode 100644
index 0000000..c38ec66
--- /dev/null
+++ b/Material/svg/outlined/schedule.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="48" width="48"><path d="M30.3 32.55q.45.45 1.05.45.6 0 1.1-.5.5-.5.525-1.15.025-.65-.475-1.1l-6.85-6.85v-8.6q0-.6-.425-1.025-.425-.425-1.075-.425-.65 0-1.075.425-.425.425-.425 1.075V24q0 .3.1.55.1.25.3.5ZM24 44q-4.1 0-7.75-1.575-3.65-1.575-6.375-4.3-2.725-2.725-4.3-6.375Q4 28.1 4 24t1.575-7.75q1.575-3.65 4.3-6.375 2.725-2.725 6.375-4.3Q19.9 4 24 4t7.75 1.575q3.65 1.575 6.375 4.3 2.725 2.725 4.3 6.375Q44 19.9 44 24t-1.575 7.75q-1.575 3.65-4.3 6.375-2.725 2.725-6.375 4.3Q28.1 44 24 44Zm0-20Zm0 17q7 0 12-5t5-12q0-7-5-12T24 7q-7 0-12 5T7 24q0 7 5 12t12 5Z"/></svg>
\ No newline at end of file
diff --git a/Material/svg/outlined/star.svg b/Material/svg/outlined/star.svg
new file mode 100644
index 0000000..5f18cb8
--- /dev/null
+++ b/Material/svg/outlined/star.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="48" width="48"><path d="m16.15 37.75 7.85-4.7 7.85 4.75-2.1-8.9 6.9-6-9.1-.8L24 13.7l-3.55 8.35-9.1.8 6.9 6Zm7.85-1.2-9.3 5.6q-.4.25-.85.225-.45-.025-.8-.275-.35-.25-.525-.65-.175-.4-.075-.9l2.45-10.6-8.2-7.15q-.4-.35-.475-.775-.075-.425.025-.825.1-.4.45-.675t.85-.325l10.85-.95 4.2-10q.2-.45.6-.675.4-.225.8-.225t.8.225q.4.225.6.675l4.2 10 10.85.95q.5.05.85.325t.45.675q.1.4.025.825-.075.425-.475.775l-8.2 7.15 2.45 10.6q.1.5-.075.9t-.525.65q-.35.25-.8.275-.45.025-.85-.225Zm0-10.3Z"/></svg>
\ No newline at end of file
diff --git a/Material/svg/outlined/table.svg b/Material/svg/outlined/table.svg
new file mode 100644
index 0000000..cb51f49
--- /dev/null
+++ b/Material/svg/outlined/table.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="48" width="48"><path d="M41 41.95H9q-1.2 0-2.1-.9-.9-.9-.9-2.1V9q0-1.2.9-2.1Q7.8 6 9 6h32q1.2 0 2.1.9.9.9.9 2.1v29.95q0 1.2-.9 2.1-.9.9-2.1.9ZM9 16.05h32V9H9Zm7.5 3H9v19.9h7.5Zm17 0v19.9H41v-19.9Zm-3 0h-11v19.9h11Z"/></svg>
\ No newline at end of file
diff --git a/shop/cart/CartTotal.ui.qml b/shop/cart/CartTotal.ui.qml
new file mode 100644
index 0000000..65d6873
--- /dev/null
+++ b/shop/cart/CartTotal.ui.qml
@@ -0,0 +1,148 @@
+import QtQuick 2.15
+import QtQuick.Controls 2.15
+import QtQuick.Layouts 1.15
+import QtGraphicalEffects 1.15
+
+Item {
+    id: cartTotal
+    DropShadow {
+        color: "#4d000000"
+        source: cartTotalCard
+        verticalOffset: 4
+        radius: 40
+        samples: 81
+        anchors.fill: cartTotalCard
+    }
+    Rectangle {
+        id: cartTotalCard
+        radius: 8
+        anchors.fill: parent
+        ColumnLayout {
+            id: cardBody
+            anchors.fill: parent
+            spacing: 16
+
+            Label {
+                id: title
+                color: "#000000"
+                text: qsTr("Cart total")
+                Layout.rightMargin: 20
+                Layout.leftMargin: 20
+                Layout.topMargin: 20
+                Layout.margins: 8
+                Layout.fillHeight: false
+                Layout.alignment: Qt.AlignLeft | Qt.AlignTop
+                Layout.fillWidth: true
+                font.pointSize: 22
+                font.styleName: "Medium"
+                font.family: "Roboto"
+            }
+
+            RowLayout {
+                id: price
+                Layout.rightMargin: 20
+                Layout.leftMargin: 20
+                Layout.bottomMargin: 0
+                Layout.fillHeight: true
+                Layout.alignment: Qt.AlignLeft | Qt.AlignTop
+                Layout.fillWidth: true
+                Label {
+                    color: "#000000"
+                    text: qsTr("Original price")
+                    Layout.fillHeight: false
+                    font.family: "Roboto"
+                    font.pointSize: 14
+                    Layout.fillWidth: true
+                }
+                Label {
+                    color: "#000000"
+                    text: qsTr("$500")
+                    horizontalAlignment: Text.AlignRight
+                    Layout.fillHeight: false
+                    font.weight: Font.Medium
+                    font.pointSize: 14
+                    Layout.fillWidth: true
+                }
+            }
+
+            RowLayout {
+                id: discount
+                Layout.rightMargin: 20
+                Layout.leftMargin: 20
+                Layout.alignment: Qt.AlignLeft | Qt.AlignTop
+                Layout.fillWidth: true
+                Label {
+                    color: "#000000"
+                    text: qsTr("Coupon discount")
+                    Layout.fillHeight: false
+                    Layout.fillWidth: true
+                    font.family: "Roboto"
+                    font.pointSize: 14
+                }
+                Label {
+                    color: "#000000"
+                    text: qsTr("-$500")
+                    horizontalAlignment: Text.AlignRight
+                    Layout.fillHeight: false
+                    Layout.fillWidth: true
+                    font.weight: Font.Medium
+                }
+            }
+
+            RowLayout {
+                id: total
+                Layout.rightMargin: 20
+                Layout.leftMargin: 20
+                Layout.alignment: Qt.AlignLeft | Qt.AlignTop
+                Layout.fillWidth: true
+                Label {
+                    color: "#000000"
+                    text: qsTr("Total")
+                    Layout.fillHeight: false
+                    font.family: "Roboto"
+                    font.styleName: "Medium"
+                    font.pointSize: 22
+                    Layout.fillWidth: true
+                }
+                Label {
+                    color: "#000000"
+                    text: qsTr("$480")
+                    horizontalAlignment: Text.AlignRight
+                    Layout.fillHeight: false
+                    font.styleName: "Medium"
+                    font.pointSize: 22
+                    font.family: "Roboto"
+                    Layout.fillWidth: true
+                }
+            }
+
+            Button {
+                id: proceedButton
+                text: qsTr("Proceed to checkout")
+                Layout.rightMargin: 20
+                Layout.leftMargin: 20
+                Layout.fillHeight: false
+                font.weight: Font.Medium
+                font.pointSize: 14
+                font.family: "Roboto"
+                Layout.fillWidth: true
+                flat: false
+                display: AbstractButton.TextOnly
+            }
+
+            Label {
+                id: consent
+                color: "#80000000"
+                text: "By completing your purchase, you agree to these Terms of Service"
+                wrapMode: Text.Wrap
+                Layout.bottomMargin: 20
+                Layout.rightMargin: 20
+                Layout.leftMargin: 20
+                Layout.fillHeight: false
+                Layout.fillWidth: true
+                font.pointSize: 12
+                font.family: "Roboto"
+            }
+        }
+    }
+}