diff options
Diffstat (limited to 'Course/Grid/Card.ui.qml')
| -rw-r--r-- | Course/Grid/Card.ui.qml | 92 |
1 files changed, 46 insertions, 46 deletions
diff --git a/Course/Grid/Card.ui.qml b/Course/Grid/Card.ui.qml index f6b0206..82a2c50 100644 --- a/Course/Grid/Card.ui.qml +++ b/Course/Grid/Card.ui.qml @@ -1,17 +1,16 @@ -import QtQuick 2.15 -import QtQuick.Controls 2.15 -import QtQuick.Layouts 1.15 -import QtGraphicalEffects 1.15 +import QtQuick +import QtQuick.Controls +import QtQuick.Layouts +import QtQuick.Effects Item { id: item1 - DropShadow { - color: "#4d000000" + MultiEffect { source: cardItem - verticalOffset: 4 - radius: 40 - samples: 81 anchors.fill: cardItem + shadowEnabled: true + shadowColor: "#4d0000" + shadowVerticalOffset: 4 } Rectangle { id: cardItem @@ -23,35 +22,30 @@ Item { id: columnLayout anchors.fill: parent spacing: 0 - Rectangle { + Image { id: cardItemImage - radius: 8 Layout.fillHeight: true - Layout.preferredHeight: 255 Layout.fillWidth: true - Layout.preferredWidth: 300 - Image { - id: cardItemImageSource - source: "https://eduport.webestica.com/assets/images/courses/4by3/08.jpg" - fillMode: Image.PreserveAspectCrop - width: parent.width - height: parent.height - visible: false + source: "https://eduport.webestica.com/assets/images/courses/4by3/08.jpg" + sourceSize { + width: 300 + height: 255 } - OpacityMask { - id: cardItemImageMask - anchors.fill: cardItemImage - source: cardItemImageSource - maskSource: cardItemImage + fillMode: Image.PreserveAspectCrop + layer { + enabled: true + effect: MultiEffect { + maskEnabled: true + maskSource: maskRectangle + } } - Rectangle { - id: rectangle - width: cardItemImageMask.width - height: 5 - color: "#ffffff" - anchors.bottom: cardItemImageMask.bottom - anchors.bottomMargin: 0 + id: maskRectangle + width: cardItemImage.sourceSize.width + height: cardItemImage.sourceSize.height + radius: 8 + layer.enabled: true + visible: false } } ColumnLayout { @@ -98,7 +92,7 @@ Item { leftPadding: 0 bottomPadding: 0 topPadding: 0 - icon.source: "Material/svg/outlined/heart.svg" + icon.source: "../../Material/svg/outlined/heart.svg" display: AbstractButton.IconOnly flat: true @@ -142,7 +136,7 @@ Item { topPadding: 0 icon.color: "#80000000" flat: true - icon.source: "Material/svg/outlined/star.svg" + icon.source: "../../Material/svg/outlined/star.svg" autoRepeat: false checkable: true display: AbstractButton.IconOnly @@ -197,13 +191,16 @@ Item { spacing: 8 Image { id: timerIcon - source: "Material/svg/outlined/schedule.svg" + source: "../../Material/svg/outlined/schedule.svg" sourceSize.height: 16 sourceSize.width: 16 - ColorOverlay { - anchors.fill: timerIcon - source: timerIcon - color: "#d6293e" + layer { + enabled: true + effect: MultiEffect { + brightness: 1.0 + colorization: 1.0 + colorizationColor: "#d6293e" + } } } @@ -222,13 +219,16 @@ Item { spacing: 8 Image { id: lecturersIcon - source: "Material/svg/outlined/table.svg" + source: "../../Material/svg/outlined/table.svg" sourceSize.height: 16 sourceSize.width: 16 - ColorOverlay { - anchors.fill: lecturersIcon - source: lecturersIcon - color: "#fd7e14" + layer { + enabled: true + effect: MultiEffect { + brightness: 1.0 + colorization: 1.0 + colorizationColor: "#fd7e14" + } } } @@ -252,7 +252,7 @@ Item { PropertyChanges { target: favorite icon.color: "#d6293e" - icon.source: "Material/svg/filled/heart.svg" + icon.source: "../../Material/svg/filled/heart.svg" } }, State { @@ -262,7 +262,7 @@ Item { PropertyChanges { target: star icon.color: "#f7c32e" - icon.source: "Material/svg/filled/star.svg" + icon.source: "../../Material/svg/filled/star.svg" } } ] |