Move course detail classic related to own folders

3 files changed, 563 insertions, 0 deletions

diff --git a/Course/Detail/Classic.ui.qml b/Course/Detail/Classic.ui.qml
new file mode 100644
index 0000000..d755076
--- /dev/null
+++ b/Course/Detail/Classic.ui.qml
@@ -0,0 +1,423 @@
+import QtQuick 2.15
+import QtQuick.Controls 2.15
+import QtQuick.Layouts 1.15
+import QtGraphicalEffects 1.15
+import "Classic/Content" as Content
+import "../.."
+
+Flickable {
+	property alias introBadge: introBadge
+	property alias introTitleHeader: introTitleHeader
+	property alias introTitleParagraph: introTitleParagraph
+	property alias tabs: tabs
+	property alias courseDescription: courseDescription
+	property alias detailImage: image
+	property alias detailPrice: price
+	property alias detailOriginalPrice: originalPrice
+	property alias detailDiscount: discount
+	property alias detailTime: time
+	property alias detailTrial: trial
+	property alias detailBuy: buy
+	property bool doesntEmbed: Qt.platform.os === "android"
+				|| Qt.platform.os === "linux"
+				|| Qt.platform.os === "osx"
+				|| Qt.platform.os === "unix"
+				|| Qt.platform.os === "windows"
+	contentHeight: body.height
+
+	ColumnLayout {
+		id: body
+		anchors {
+			top: parent.top
+			left: parent.left
+			right: parent.right
+		}
+
+		FontLoader {
+			id: heebo
+			source: "../../Heebo/Heebo-Bold.ttf"
+		}
+
+		FontLoader {
+			id: bold
+			source: doesntEmbed ? "" : "../../Roboto/Roboto-Bold.ttf"
+		}
+
+		FontLoader {
+			id: medium
+			source: doesntEmbed ? "" : "../../Roboto/Roboto-Medium.ttf"
+		}
+
+		FontLoader {
+			id: regular
+			source: doesntEmbed ? "" : "../../Roboto/Roboto-Regular.ttf"
+		}
+
+		Rectangle {
+			color: "#f5f7f9"
+			Layout.fillWidth: true
+			implicitHeight: pageIntro.height + 96
+
+			ColumnLayout {
+				id: pageIntro
+				anchors {
+					left: parent.left
+					leftMargin: 15
+					right: parent.right
+					rightMargin: 15
+					verticalCenter: parent.verticalCenter
+				}
+
+				Rectangle {
+					Layout.bottomMargin: 16
+					implicitWidth: introBadge.width
+					implicitHeight: introBadge.height
+					radius: 5.2
+					color: Qt.rgba( .0235, .416, .788, 1.0)
+					Label {
+						id: introBadge
+						text: qsTr("Digital Marketing")
+						color: "white"
+						font {
+							family: doesntEmbed ? "Roboto" : bold.name
+							weight: Font.Bold
+							pointSize: 15
+						}
+						horizontalAlignment: Text.AlignHCenter
+						verticalAlignment: Text.AlignVCenter
+						topPadding: 8
+						leftPadding: 25.6
+						rightPadding: 25.6
+						bottomPadding: 8
+					}
+				}
+
+				Label {
+					id: introTitleHeader
+					text: qsTr("The Complete Digital Marketing Course - 12 Courses in 1")
+					color: "#24292d"
+					wrapMode: Text.Wrap
+					Layout.fillWidth: true
+					font {
+						family: heebo.name
+						pointSize: 30
+					}
+				}
+
+				Label {
+					id: introTitleParagraph
+					text: qsTr("Satisfied conveying a dependent contented he gentleman agreeable do be. Warrant private blushes removed an in equally totally if. Delivered dejection necessary objection do Mr prevailed. Mr feeling does chiefly cordial in do.")
+					color: "#747579"
+					wrapMode: Text.Wrap
+					Layout.fillWidth: true
+					font {
+						family: doesntEmbed ? "Roboto" : regular.name
+						pointSize: 15
+					}
+				}
+			}
+		}
+
+		GridLayout {
+			Layout.topMargin: 64
+			columns: width < 992 ? 1 : 2
+			rows: width < 992 ? 2 : 1
+
+			ColumnLayout {
+				Layout.alignment: Qt.AlignTop
+				Layout.maximumWidth: body.width < 992
+					? body.width : body.width / 2
+
+				Item {
+					Layout.fillWidth: true
+					Layout.leftMargin: 15
+					Layout.rightMargin: 15
+					implicitHeight: mainContent.height
+
+					DropShadow {
+						source: mainContent
+						color: "#4d000000"
+						verticalOffset: 4
+						radius: 12
+						samples: 12
+						anchors.fill: mainContent
+					}
+
+					Rectangle {
+						id: mainContent
+						radius: 5.2
+						anchors {
+							left: parent.left
+							right: parent.right
+						}
+						implicitHeight: tabs.height + tabsContent.height + 83.2
+
+						ColumnLayout {
+							anchors {
+								left: parent.left
+								leftMargin: 25.6
+								right: parent.right
+								rightMargin: 25.6
+							}
+
+							GridView {
+								id: tabs
+								interactive: false
+								Layout.fillWidth: true
+								Layout.topMargin: 16
+								Layout.bottomMargin: 16
+								cellWidth: 105.016
+								cellHeight: 46
+								implicitHeight: Math.ceil(count / Math.floor(count / (cellWidth * count / width))) * cellHeight
+								model: ["Overview", "Curriculum", "Instructor", "Reviews", "FAQs", "Comment"]
+								delegate: TabItem {
+									contentItem: Text {
+										text: modelData
+										color: "#066ac9"
+										font {
+											family: doesntEmbed ? "Roboto" : regular.name
+											pointSize: 15
+										}
+									}
+									background: Rectangle {
+										color: index == currentIndex ? "#1a0fffff" : "transparent"
+										radius: 5.2
+									}
+								}
+							}
+
+							StackLayout {
+								id: tabsContent
+								currentIndex: tabs.currentIndex
+								Layout.topMargin: 33.6
+								Layout.leftMargin: 25.6
+								Layout.rightMargin: 25.6
+								Layout.bottomMargin: 25.6
+
+								ColumnLayout {
+
+									Label {
+										text: qsTr("Course Description")
+										color: "#24292d"
+										wrapMode: Text.Wrap
+										Layout.fillWidth: true
+										Layout.bottomMargin: 16
+										font {
+											family: heebo.name
+											pointSize: 20.1
+										}
+									}
+
+									Label {
+										id: courseDescription
+										text: qsTr("Welcome to the Digital Marketing Ultimate Course Bundle - 12 Courses in 1 (Over 36 hours of content)")
+										color: "#747579"
+										wrapMode: Text.Wrap
+										Layout.fillWidth: true
+										font {
+											family: doesntEmbed ? "Roboto" : regular.name
+											pointSize: 15
+										}
+									}
+								}
+
+								Item {}
+
+								Content.Instructor {}
+
+								Item {}
+
+								Item {}
+
+								Item {}
+							}
+						}
+					}
+				}
+			}
+
+			ColumnLayout {
+
+				Item {
+					Layout.fillWidth: true
+					implicitHeight: width * 1.2
+
+					DropShadow {
+						source: rightSidebar
+						color: Qt.rgba(.113, .227, .325, .15)
+						anchors.fill: rightSidebar
+					}
+
+					Rectangle {
+						id: rightSidebar
+						radius: 10
+						anchors {
+							top: parent.top
+							topMargin: 25.6
+							left: parent.left
+							leftMargin: 12.8
+							right: parent.right
+							rightMargin: 12.8
+							bottom: parent.bottom
+						}
+
+						Image {
+							id: image
+							source: "https://eduport.webestica.com/assets/images/courses/4by3/01.jpg"
+							width: parent.width - 16
+							height: parent.width * 3 / 4
+							anchors {
+								top: parent.top
+								topMargin: 8
+								horizontalCenter: parent.horizontalCenter
+							}
+							layer.enabled: true
+							layer.effect: OpacityMask {
+								maskSource: Rectangle {
+									width: image.width
+									height: image.height
+									radius: 10
+									    }
+							}
+						}
+
+						ColumnLayout {
+							width: parent.width - 16
+							anchors {
+								top: image.bottom
+								horizontalCenter: parent.horizontalCenter
+								bottom: parent.bottom
+								bottomMargin: 8
+							}
+
+							RowLayout {
+								Layout.topMargin: 16
+								Layout.bottomMargin: 16
+
+								ColumnLayout {
+									spacing: 8
+
+									RowLayout {
+
+										Label {
+											id: price
+											text: "$150"
+											font {
+												family: heebo.name
+												pointSize: 23
+											}
+										}
+
+										Label {
+											id: originalPrice
+											text: "$350"
+											color: "#4d000000"
+											font {
+												family: doesntEmbed ? "Roboto" : regular.name
+												pointSize: 15
+												strikeout: true
+											}
+										}
+
+										Rectangle {
+											id: discountLabel
+											implicitWidth: discount.width
+											implicitHeight: discount.height
+											radius: 6
+											color: "#fd7e14"
+
+											Label {
+												id: discount
+												text: qsTr("60% off")
+												color: "white"
+												font {
+													family: doesntEmbed ? "Roboto" : regular.name
+													pointSize: 13.6
+												}
+												horizontalAlignment: Text.AlignHCenter
+												verticalAlignment: Text.AlignVCenter
+												topPadding: 4.46
+												leftPadding: 8.29
+												rightPadding: 8.29
+												bottomPadding: 4.46
+											}
+										}
+									}
+
+									RowLayout {
+										id: time
+
+										Label {
+											text: qsTr("5 days left at this price")
+											color: "#d6293e"
+											font {
+												family: doesntEmbed ? "Roboto" : regular.name
+												pointSize: 15
+											}
+										}
+									}
+								}
+							}
+
+							RowLayout {
+								Layout.topMargin: 16
+								Layout.fillWidth: true
+								spacing: 16
+
+								Button {
+									id: trial
+									text: qsTr("Free trial")
+									horizontalPadding: 16
+									verticalPadding: 8
+									contentItem: Text {
+										horizontalAlignment: Text.AlignHCenter
+										text: trial.text
+										color: trial.down ? "#ffffff" : "#066ac9"
+										font {
+											family: doesntEmbed ? "Roboto" : medium.name
+											weight: Font.Medium
+											pointSize: 15
+										}
+									}
+									background: Rectangle {
+										color: trial.down ? "#066ac9" : "#ffffff"
+										radius: 5.2
+										border {
+											color: "#066ac9"
+											width: 1
+										}
+									}
+								}
+
+								Button {
+									id: buy
+									text: qsTr("Buy course")
+									horizontalPadding: 16
+									verticalPadding: 8
+									contentItem: Text {
+										horizontalAlignment: Text.AlignHCenter
+										text: buy.text
+										color: "#ffffff"
+										font {
+											family: doesntEmbed ? "Roboto" : medium.name
+											weight: Font.Medium
+											pointSize: 15
+										}
+									}
+									background: Rectangle {
+										color: buy.down ? "#0aa073" : "#0cbc87"
+										radius: 5.2
+										border {
+											color: buy.down ? "#0a966c" : "#0cbc87"
+											width: 1
+										}
+									}
+								}
+							}
+						}
+					}
+				}
+			}
+		}
+	}
+}
diff --git a/Course/Detail/Classic/Content/Instructor.ui.qml b/Course/Detail/Classic/Content/Instructor.ui.qml
new file mode 100644
index 0000000..6f231aa
--- /dev/null
+++ b/Course/Detail/Classic/Content/Instructor.ui.qml
@@ -0,0 +1,91 @@
+import QtQuick 2.15
+import QtQuick.Controls 2.15
+import QtQuick.Layouts 1.15
+import "Instructor"
+
+GridLayout {
+	id: instructorContent
+	width: instructorContent.width
+	height: instructorContent.height
+    rowSpacing: 16
+    columnSpacing: 16
+    flow: GridLayout.TopToBottom
+
+	RowLayout {
+		id: instructorStatistics
+		Image {
+			id: instructorImage
+			Layout.preferredWidth: 300
+			Layout.preferredHeight: 300
+			source: "https://eduport.webestica.com/assets/images/instructor/01.jpg"
+			fillMode: Image.PreserveAspectFit
+			Layout.margins: 8
+		}
+		ColumnLayout {
+			id: instructorBody
+			spacing: 8
+			Layout.margins: 8
+			
+			Label {
+				id: instructorFullname
+				color: "#000000"
+				text: qsTr("Instructor Fullname")
+				font.styleName: "Bold"
+				font.pointSize: 32
+				font.family: "roboto"
+
+			}
+			Label {
+				id: instructorTitle
+				color: "#66000000"
+				text: qsTr("Instructor of Marketing")
+				font.styleName: "Regular"
+				font.pointSize: 16
+				font.family: "roboto"
+			}
+			RowLayout{
+				spacing: 16
+				ListInlineItem {
+					id: listInlineItem1
+				}
+				
+				ListInlineItem {
+					id: listInlineItem2
+				}
+				
+				ListInlineItem {
+					id: listInlineItem3
+				}
+				
+				ListInlineItem {
+					id: listInlineItem4
+				}
+				
+			}
+		}
+	}
+	ColumnLayout {
+		id: insturctorInfo
+        width: instructorStatistics.width
+        spacing: 0
+		Label {
+			color: "#000000"
+			text: qsTr("About Instructor")
+            leftPadding: 8
+			font.styleName: "Medium"
+			font.pointSize: 21
+			font.family: "roboto"
+		}
+		Label {
+			color: "#66000000"
+			width: 720
+			text: qsTr("Fulfilled direction use continual set him propriety continued. Saw met applauded favorite deficient engrossed concealed and her. Concluded boy perpetual old supposing. Farther related bed and passage comfort civilly. Dashboard see frankness objection abilities. As hastened oh produced prospect formerly up am. Placing forming nay looking old married few has. Margaret disposed of add screened rendered six say his striking confined. As it so contrasted oh estimating instrument. Size like body someone had. Are conduct viewing boy minutes warrant the expense? Tolerably behavior may admit daughters offending her ask own. Praise effect wishes change way and any wanted.")
+            wrapMode: Text.WordWrap
+            leftPadding: 8
+			font.styleName: "Regular"
+			font.pointSize: 14
+			font.family: "roboto"
+            Layout.fillWidth: true
+		}
+	}
+}
diff --git a/Course/Detail/Classic/Content/Instructor/ListInlineItem.ui.qml b/Course/Detail/Classic/Content/Instructor/ListInlineItem.ui.qml
new file mode 100644
index 0000000..6e30ffc
--- /dev/null
+++ b/Course/Detail/Classic/Content/Instructor/ListInlineItem.ui.qml
@@ -0,0 +1,49 @@
+import QtQuick 2.15
+import QtQuick.Controls 2.15
+import QtQuick.Layouts 1.15
+import QtGraphicalEffects 1.12
+
+
+RowLayout {
+	id:listInline
+	width: listInlineItem.width
+	height: listInlineItem.height
+	RowLayout {
+		id:listInlineItem
+		Rectangle {
+			id: inlineItemIconBg
+			radius: 100
+			color: "#4dfd7e14"
+			Layout.preferredHeight: 42
+			Layout.preferredWidth: 42
+			Layout.minimumHeight: 42
+			Layout.minimumWidth: 42
+			
+			Image {
+				id: inlineItemIcon
+				anchors.verticalCenter: parent.verticalCenter
+				source: "../../../../../Material/svg/filled/school.svg"
+				anchors.horizontalCenter: parent.horizontalCenter
+				fillMode: Image.PreserveAspectFit
+				Layout.preferredHeight: 12
+				Layout.preferredWidth: 12
+				Layout.minimumHeight: 12
+				Layout.minimumWidth: 12
+
+				ColorOverlay{
+					anchors.fill: inlineItemIcon
+					source: inlineItemIcon
+					color: "#fd7e14"
+				}
+			}
+		}
+		Label {
+			id: instructorTitle
+			color: "#000000"
+			text: qsTr("List inline item metrics")
+			font.styleName: "Regular"
+			font.pointSize: 14
+			font.family: "roboto"
+		}
+	}
+}