diff options
Diffstat (limited to 'Home/Default')
-rw-r--r-- | Home/Default/Card.ui.qml | 222 |
1 files changed, 222 insertions, 0 deletions
diff --git a/Home/Default/Card.ui.qml b/Home/Default/Card.ui.qml new file mode 100644 index 0000000..d10ebf1 --- /dev/null +++ b/Home/Default/Card.ui.qml @@ -0,0 +1,222 @@ +import QtQuick 2.15 +import QtQuick.Controls 2.15 +import QtQuick.Layouts 1.15 +import QtGraphicalEffects 1.15 +import Bootstrap 5.3 +import Eduport 1.4 + +Item { + property string imageSource: "https://eduport.webestica.com/assets/images/courses/4by3/11.jpg" + readonly property color allLevelsColor: "#ff6f42c1" + readonly property color beginnerColor: "#ff0cbc87" + readonly property color intermediateColor: "#ff17a2b8" + readonly property color allLevelsBackgroundColor: "#1a6f42c1" + readonly property color beginnerBackgroundColor: "#1a0cbc87" + readonly property color intermediateBackgroundColor: "#1a17a2b8" + property string badgeText: "All level" + property color badgeColor: "#ff6f42c1" + property color badgeBackgroundColor: "#1a6f42c1" + property string titleText: "Build Responsive Websites with HTML" + property alias titleArea: titleArea + property string truncatedText: "Far advanced settling say finished raillery. Offered chiefly farther" + + DropShadow { + source: rectangle + color: "#261d3a53" + radius: 5 + samples: 11 + anchors.fill: rectangle + } + + Rectangle { + id: rectangle + radius: 8 + anchors { + fill: parent + topMargin: 25.6 + leftMargin: 12.8 + rightMargin: 12.8 + } + + Image { + id: image + anchors { + top: parent.top + left: parent.left + right: parent.right + } + source: imageSource + fillMode: Image.PreserveAspectFit + layer.enabled: true + layer.effect: OpacityMask { + maskSource: Rectangle { + width: image.width + height: image.height + radius: 8 + } + } + } + + Rectangle { + height: 16 + anchors { + left: parent.left + right: parent.right + bottom: image.bottom + } + } + + ColumnLayout { + id: body + anchors { + top: image.bottom + left: parent.left + leftMargin: 20 + right: parent.right + rightMargin: 20 + bottom: footer.top + } + + Item { + id: badgeAndFavorite + height: badge.height + Layout.fillWidth: true + Layout.bottomMargin: 8 + + Label { + id: badge + anchors.left: parent.left + topPadding: 4.463 + leftPadding: 8.287 + rightPadding: 8.287 + bottomPadding: 4.463 + text: badgeText + color: badgeColor + font { + family: Bootstrap.bodyFont + .family + pointSize: Bootstrap + .badgeFontSize + } + background: Rectangle { + color: badgeBackgroundColor + radius: 6 + } + } + + Image { + id: favorite + source: "../../Font-Awesome/svgs/solid/heart.svg" + sourceSize { + width: 15 + height: 15 + } + anchors { + right: parent.right + verticalCenter: parent + .verticalCenter + } + } + } + + Label { + id: title + text: titleText + color: Qt.rgba(.141, .161, .176, 1.0) + wrapMode: Text.Wrap + Layout.fillWidth: true + Layout.bottomMargin: 8 + font { + family: Eduport.hFont.family + weight: Eduport.hFont.weight + pointSize: 20.1 + .00075 * parent.width + } + + MouseArea { + id: titleArea + anchors.fill: parent + } + } + + Label { + text: truncatedText + color: Qt.rgba(.455, .459, .475, 1.0) + wrapMode: Text.Wrap + elide: Text.ElideRight + maximumLineCount: 2 + Layout.fillWidth: true + Layout.bottomMargin: 8 + font { + family: Bootstrap.bodyFont.family + weight: Bootstrap.bodyFont.weight + pointSize: Bootstrap.bodyFont.pointSize + } + } + + RowLayout { + id: listInline + } + } + + ColumnLayout { + id: footer + anchors { + left: parent.left + leftMargin: 16 + right: parent.right + rightMargin: 16 + bottom: parent.bottom + bottomMargin: 16 + } + + Rectangle { + border { + color: "#229a9ea4" + width: .5 + } + height: 1 + Layout.fillWidth: true + Layout.topMargin: 16 + Layout.bottomMargin: 16 + } + + Item { + Layout.fillWidth: true + + Label { + id: duration + text: "15h 30m" + anchors { + top: parent.top + left: parent.left + bottom: parent.bottom + } + font { + family: Eduport.fwLightFont + .family + weight: Eduport.fwLightFont + .weight + pointSize: Eduport.h6FontSize + } + } + + Label { + id: lectures + text: "68 lectures" + anchors { + top: parent.top + right: parent.right + bottom: parent.bottom + } + font { + family: Eduport.fwLightFont + .family + weight: Eduport.fwLightFont + .weight + pointSize: Eduport.h6FontSize + } + } + } + } + } +} |