summaryrefslogtreecommitdiff
path: root/GridCardItem.ui.qml
blob: 64b1dc8cc520ecd17f0e597de6e70e26b6dae323 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
import QtQuick 2.15
import QtQuick.Controls 2.15
import QtGraphicalEffects 1.15

Item {
	property string imageSource: "Darapsa.svg"
	property string badgeText: "Beginner"
	property string titleText: "Sketch from A to Z: for app designer"
//	property string textTruncateText: "Rooms oh fully taken by worse do. Points afraid but may end afraid but.."

	DropShadow {
		source: rectangle
		color: Qt.rgba(.113, .227, .325, .15)
		anchors.fill: rectangle
	}

	Rectangle {
		id: rectangle
		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: imageSource
			sourceSize {
				width: parent.width
				height: parent.width * 3 / 4
			}
			anchors.top: parent.top
			layer.enabled: true
			layer.effect: OpacityMask {
				maskSource: Rectangle {
					width: image.width
					height: image.height
					radius: 10
				}
			}
		}

		Item {
			id: body
			width: parent.width
			anchors {
				top: image.bottom
				bottom: footer.top
			}

			Item {
				id: badgeAndFavorite
				height: body.height / 6
				anchors {
					top: parent.top
					topMargin: 16
					left: parent.left
					leftMargin: 20
					right: parent.right
					rightMargin: 20
				}

				Label {
					id: badge
					text: badgeText
					font.pointSize:12
					anchors {
						left: parent.left
						verticalCenter: parent.verticalCenter
					}
				}

				Image {
					id: favorite
					source: "Font-Awesome/svgs/solid/heart.svg"
					sourceSize {
						width: height
						height: parent.height / 1.5
					}
					anchors {
						right: parent.right
						verticalCenter: parent.verticalCenter
					}
				}

			}

			Label {
				id: title
				width: parent.width
				text: titleText
				wrapMode: Text.Wrap
				font {
					weight: Font.Medium
					pointSize: 20
				}
				anchors {
					top: badgeAndFavorite.bottom
					topMargin: 8
					left: parent.left
					leftMargin: 20
					right: parent.right
					rightMargin: 20
				}
			}
/*
			Label {
				id: textTruncate
				text: textTruncateText
				wrapMode: Text.Wrap
				font {
					weight: Font.Light
					pointSize: 14
				}
			}
*/
			Item {
				id: listInline
				height: badgeAndFavorite.height
				anchors {
					top: title.bottom
					topMargin: 8
					left: parent.left
					leftMargin: 20
					right: parent.right
					rightMargin: 20
				}
			}
		}

		Item {
			id: footer
			width: parent.width
			height: (parent.height - image.sourceSize.height) / 3
			anchors.bottom: parent.bottom
		}
	}

	width: 323.9
	height: 446.583
}