From b18f44a86757a8feedc977a762a6822cafa0cb19 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=A6=8C=EA=A6=AB=EA=A6=B6=EA=A6=8F=EA=A7=80=EA=A6=A6?= =?UTF-8?q?=EA=A6=BF=EA=A6=A7=EA=A6=AE=EA=A6=91=EA=A6=A9=EA=A6=AD=EA=A7=80?= Date: Sun, 2 Apr 2023 16:46:35 +0800 Subject: Move to be used files to each dir --- .../TabContents/Curriculum/CourseLecture.ui.qml | 63 ++++++++ .../Main/TabContents/Reviews/LeaveReview.ui.qml | 98 ++++++++++++ .../Main/TabContents/Reviews/ReviewItem.ui.qml | 69 +++++++++ .../Content/Sidebar/RecentlyViewedCard.ui.qml | 125 +++++++++++++++ .../Classic/Content/Sidebar/Video-alt.ui.qml | 169 +++++++++++++++++++++ 5 files changed, 524 insertions(+) create mode 100644 Course/Detail/Classic/Content/Main/TabContents/Curriculum/CourseLecture.ui.qml create mode 100644 Course/Detail/Classic/Content/Main/TabContents/Reviews/LeaveReview.ui.qml create mode 100644 Course/Detail/Classic/Content/Main/TabContents/Reviews/ReviewItem.ui.qml create mode 100644 Course/Detail/Classic/Content/Sidebar/RecentlyViewedCard.ui.qml create mode 100644 Course/Detail/Classic/Content/Sidebar/Video-alt.ui.qml (limited to 'Course/Detail') diff --git a/Course/Detail/Classic/Content/Main/TabContents/Curriculum/CourseLecture.ui.qml b/Course/Detail/Classic/Content/Main/TabContents/Curriculum/CourseLecture.ui.qml new file mode 100644 index 0000000..8dfbff3 --- /dev/null +++ b/Course/Detail/Classic/Content/Main/TabContents/Curriculum/CourseLecture.ui.qml @@ -0,0 +1,63 @@ +import QtQuick 2.15 +import QtQuick.Controls 2.15 +import QtQuick.Layouts 1.15 + +Rectangle { + width: coursecontent.width + height: coursecontent.height + color: "#fff" + RowLayout { + id: coursecontent + spacing: 8 + Layout.margins: 8 + Button { + id: play + icon.source: "Font-Awesome/svgs/solid/circle-play.svg" + icon.color: "#ffffff" + Layout.margins: 8 + display: AbstractButton.IconOnly + Layout.preferredHeight: 32 + Layout.preferredWidth: 32 + Layout.minimumHeight: 32 + Layout.minimumWidth: 32 + background: Rectangle { + color: play.down ? "#ff2c2c": "#4dff2c2c" + radius: 100 + } + } + Label { + id: coursetitle + Layout.margins: 8 + color: "#000000" + text: "Course title" + font.pointSize: 16 + font.family: "roboto" + verticalAlignment: Text.AlignVCenter + } + Label { + Layout.margins: 8 + id: premiumbadge + color: "#ffffff" + text: "Premium" + font.pointSize: 12 + font.family: "roboto" + verticalAlignment: Text.AlignVCenter + rightPadding: 8 + leftPadding: 8 + padding: 4 + background: Rectangle { + color: "#fd7e14" + radius: 8 + } + } + Label { + Layout.margins: 8 + id: courselength + color: "#4d000000" + text: "11m 12s" + font.pointSize: 16 + font.family: "roboto" + Layout.alignment: Qt.AlignRight | Qt.AlignVCenter + } + } +} diff --git a/Course/Detail/Classic/Content/Main/TabContents/Reviews/LeaveReview.ui.qml b/Course/Detail/Classic/Content/Main/TabContents/Reviews/LeaveReview.ui.qml new file mode 100644 index 0000000..22a102a --- /dev/null +++ b/Course/Detail/Classic/Content/Main/TabContents/Reviews/LeaveReview.ui.qml @@ -0,0 +1,98 @@ +import QtQuick 2.15 +import QtQuick.Controls 2.15 +import QtQuick.Layouts 1.15 + +Column { + spacing: 16 + Layout.fillWidth: true + Label { + color: "#000000" + text: "Leave a review" + font.pointSize: 21 + font.family: "roboto" + font.styleName: "Medium" + Layout.fillWidth: true + } + RowLayout { + Layout.fillWidth: true + TextField { + placeholderTextColor: "#7f000000" + placeholderText: "Full name" + background: Rectangle { + radius: 8 + color: "#f5f7f9" + } + Layout.fillWidth: true + } + TextField { + placeholderTextColor: "#7f000000" + placeholderText: "Email" + background: Rectangle { + radius: 8 + color: "#f5f7f9" + } + Layout.fillWidth: true + } + } + ComboBox { + id: reviewChoices + Layout.fillWidth: true + font.pointSize: 14 + font.family: "roboto" + model: ListModel { + ListElement { + label: "Please choose one" + } + ListElement { + label: "5/5" + } + ListElement { + label: "4/5" + } + ListElement { + label: "3/5" + } + ListElement { + label: "2/5" + } + ListElement { + label: "1/5" + } + } + background: Rectangle{ + radius: 8 + color: "#f5f7f9" + } + } + TextArea { + id: textArea + placeholderText: qsTr("Text Area") + Layout.preferredHeight: 82 + Layout.minimumHeight: 82 + background: Rectangle{ + radius: 8 + color: "#f5f7f9" + } + } + Button { + id: button + text: qsTr("Post a review") + font.pixelSize: 14 + implicitHeight: 36 + Layout.fillWidth: true + contentItem: Text { + color: "#ffffff" + text: "Login" + horizontalAlignment: Text.AlignHCenter + verticalAlignment: Text.AlignVCenter + font.weight: Font.Medium + font.family: "Roboto" + font.pointSize: 14 + } + + background: Rectangle { + color: button.down ? "#055aab" : "#066ac9" + radius: 8 + } + } +} diff --git a/Course/Detail/Classic/Content/Main/TabContents/Reviews/ReviewItem.ui.qml b/Course/Detail/Classic/Content/Main/TabContents/Reviews/ReviewItem.ui.qml new file mode 100644 index 0000000..4f7f4a3 --- /dev/null +++ b/Course/Detail/Classic/Content/Main/TabContents/Reviews/ReviewItem.ui.qml @@ -0,0 +1,69 @@ +import QtQuick 2.15 +import QtQuick.Controls 2.15 +import QtQuick.Layouts 1.15 +import QtGraphicalEffects 1.12 + +Item { + width: reviewItem.width + height: reviewItem.height + RowLayout { + id:reviewItem + spacing: 16 + RowLayout { + id: reviewAvatar + Layout.alignment: Qt.AlignLeft | Qt.AlignTop + Rectangle { + id: avatarMask + radius: 100 + Layout.preferredHeight: 82 + Layout.preferredWidth: 82 + Layout.minimumHeight: 82 + Layout.minimumWidth: 82 + Image{ + id: avatarImage + source: "https://eduport.webestica.com/assets/images/avatar/09.jpg" + sourceSize: Qt.size(parent.width, parent.height) + visible: false + } + } + OpacityMask { + anchors.fill: avatarMask + source: avatarImage + maskSource: avatarMask + } + } + ColumnLayout { + id: reviewDetails + Layout.alignment: Qt.AlignLeft | Qt.AlignTop + Layout.maximumWidth: 680 + spacing: 8 + + Label { + id: reviewerName + color: "#000000" + text: "Reviewer Name" + font.pointSize: 21 + font.family: "roboto" + Layout.fillWidth: true + } + Label { + id: reviewTimestamp + color: "#4d000000" + text: "2 days ago" + font.pointSize: 14 + font.family: "roboto" + Layout.fillWidth: true + } + Label { + id: reviewText + color: "#4d000000" + text: "Perceived end knowledge certainly day sweetness why cordially. Ask a quick six seven offer see among. Handsome met debating sir dwelling age material. As style lived he worse dried. Offered related so visitors we private removed. Moderate do subjects to distance." + wrapMode: Text.WordWrap + font.pointSize: 16 + font.family: "roboto" + Layout.fillWidth: true + } + } + + } +} \ No newline at end of file diff --git a/Course/Detail/Classic/Content/Sidebar/RecentlyViewedCard.ui.qml b/Course/Detail/Classic/Content/Sidebar/RecentlyViewedCard.ui.qml new file mode 100644 index 0000000..3572dbf --- /dev/null +++ b/Course/Detail/Classic/Content/Sidebar/RecentlyViewedCard.ui.qml @@ -0,0 +1,125 @@ +import QtQuick 2.15 +import QtQuick.Controls 2.15 +import QtQuick.Layouts 1.15 +import QtGraphicalEffects 1.15 + +Rectangle { + id: recentlyViewedCard + Layout.fillWidth: true + implicitHeight: recentlyCardContent.height + color: "#ffffff" + radius: 8 + anchors.margins: 24 + + ColumnLayout { + id: recentlyCardContent + anchors { + left: parent.left + right: parent.right + } + spacing: 16 + Label { + text: qsTr("Recently viewed") + font.pointSize: 22 + font.family: "roboto" + color: "#000000" + Layout.fillWidth: true + Layout.leftMargin: 24 + Layout.topMargin: 24 + Layout.rightMargin: 24 + } + RowLayout { + Layout.fillWidth: true + Layout.fillHeight: true + spacing: 16 + Layout.leftMargin: 24 + Layout.rightMargin: 24 + Rectangle { + color: "#eee" + height: 80 + width: 100 + radius: 8 + } + ColumnLayout { + Layout.fillWidth: true + Layout.fillHeight: true + Label { + text: qsTr("Course title") + font.pointSize: 14 + font.family: "roboto" + font.styleName: "Medium" + color: "#000000" + Layout.fillWidth: true + } + RowLayout { + Layout.fillWidth: true + Layout.fillHeight: true + Label { + text: qsTr("$") + font.pointSize: 14 + font.family: "roboto" + font.styleName: "Medium" + color: "#0cbc87" + Layout.fillWidth: true + } + Label { + text: qsTr("4.5") + horizontalAlignment: Text.AlignRight + font.pointSize: 14 + font.family: "roboto" + font.styleName: "Medium" + color: "#000000" + Layout.fillWidth: true + } + } + } + } + RowLayout { + Layout.fillWidth: true + Layout.fillHeight: true + spacing: 16 + Layout.leftMargin: 24 + Layout.rightMargin: 24 + Layout.bottomMargin: 24 + Rectangle { + color: "#eee" + height: 80 + width: 100 + radius: 8 + } + ColumnLayout { + Layout.fillWidth: true + Layout.fillHeight: true + Label { + text: qsTr("Course title") + font.pointSize: 14 + font.family: "roboto" + font.styleName: "Medium" + color: "#000000" + Layout.fillWidth: true + } + RowLayout { + Layout.fillWidth: true + Layout.fillHeight: true + Label { + text: qsTr("$") + font.pointSize: 14 + font.family: "roboto" + font.styleName: "Medium" + color: "#0cbc87" + Layout.fillWidth: true + } + Label { + text: qsTr("4.5") + horizontalAlignment: Text.AlignRight + font.pointSize: 14 + font.family: "roboto" + font.styleName: "Medium" + color: "#000000" + Layout.fillWidth: true + } + } + } + } + } +} diff --git a/Course/Detail/Classic/Content/Sidebar/Video-alt.ui.qml b/Course/Detail/Classic/Content/Sidebar/Video-alt.ui.qml new file mode 100644 index 0000000..f715a94 --- /dev/null +++ b/Course/Detail/Classic/Content/Sidebar/Video-alt.ui.qml @@ -0,0 +1,169 @@ +import QtQuick 2.15 +import QtQuick.Controls 2.15 +import QtQuick.Layouts 1.15 +import QtGraphicalEffects 1.15 + +Item { + width: 350 + height: 450 + DropShadow { + color: "#4d000000" + source: courseVideoCard + verticalOffset: 4 + radius: 12 + samples: 12 + anchors.fill: courseVideoCard + } + Rectangle { + id: courseVideoCard + radius: 8 + anchors.fill: parent + anchors.rightMargin: 8 + anchors.leftMargin: 8 + anchors.bottomMargin: 8 + anchors.topMargin: 8 + ColumnLayout { + id: courseDetailVideo + anchors.fill: parent + Rectangle { + id: courseVideoThumbnail + radius: 8 + Layout.rightMargin: 8 + Layout.leftMargin: 8 + Layout.bottomMargin: 0 + Layout.topMargin: 8 + Layout.fillHeight: true + Layout.fillWidth: true + Image { + id: courseVideoImage + source: "https://eduport.webestica.com/assets/images/courses/4by3/01.jpg" + fillMode: Image.PreserveAspectCrop + width: parent.width + height: parent.height + visible: false + } + OpacityMask { + id: courseVideoMask + anchors.fill: courseVideoThumbnail + source: courseVideoImage + maskSource: courseVideoThumbnail + } + ColorOverlay { + anchors.fill: courseVideoMask + source: courseVideoMask + color: "#80000000" + } + Button { + id: playVideoButton + width: 44 + height: 44 + anchors.verticalCenter: parent.verticalCenter + icon.height: 44 + icon.width: 44 + icon.color: "#ffffff" + flat: true + icon.source: "Font-Awesome/svgs/solid/circle-play.svg" + display: AbstractButton.IconOnly + anchors.horizontalCenter: parent.horizontalCenter + } + } + RowLayout { + id: priceAndTime + spacing: 8 + Layout.rightMargin: 16 + Layout.leftMargin: 16 + Layout.topMargin: 8 + Layout.bottomMargin: 4 + Label { + id: publishedPrice + color: "#000000" + text: "$150" + font.weight: Font.Medium + verticalAlignment: Text.AlignVCenter + font.pointSize: 32 + font.family: "Roboto" + } + Label { + id: originalPrice + color: "#80000000" + text: "$150" + font.strikeout: true + font.weight: Font.Medium + verticalAlignment: Text.AlignVCenter + font.pointSize: 16 + font.family: "Roboto" + } + Label { + id: discount + color: "#ffffff" + text: "60% off" + horizontalAlignment: Text.AlignHCenter + verticalAlignment: Text.AlignVCenter + font.pointSize: 12 + rightPadding: 8 + leftPadding: 8 + bottomPadding: 4 + topPadding: 4 + font.family: "Roboto" + background: Rectangle { + width: discount.width + height: discount.height + color: "#fd7e14" + radius: 4 + } + } + } + RowLayout { + id: timerContent + Layout.topMargin: 4 + Layout.bottomMargin: 8 + Layout.rightMargin: 16 + Layout.leftMargin: 16 + spacing: 8 + Image { + id: timerIcon + source: "Material/svg/filled/timer.svg" + sourceSize.height: 24 + sourceSize.width: 24 + ColorOverlay { + anchors.fill: timerIcon + source: timerIcon + color: "#d6293e" + } + } + + Label { + color: "#d6293e" + text: "5 days left at this price" + font.family: "Roboto" + font.pointSize: 14 + font.styleName: "Regular" + } + } + RowLayout { + id: cardFooterButton + Layout.topMargin: 8 + Layout.margins: 16 + spacing: 8 + + Button { + id: freeTrialButton + text: qsTr("Free trial") + font.styleName: "Medium" + font.pointSize: 14 + font.family: "Roboto" + Layout.fillWidth: true + } + + Button { + id: buyButton + text: qsTr("Buy course") + font.styleName: "Medium" + font.pointSize: 14 + font.family: "Roboto" + Layout.fillWidth: true + } + } + } + } +} \ No newline at end of file -- cgit v1.2.3