summaryrefslogtreecommitdiff
path: root/components
diff options
context:
space:
mode:
Diffstat (limited to 'components')
-rw-r--r--components/ListWithIconForm.ui.qml66
-rw-r--r--components/ProductCardForm.ui.qml232
2 files changed, 143 insertions, 155 deletions
diff --git a/components/ListWithIconForm.ui.qml b/components/ListWithIconForm.ui.qml
index 5e03180..450a679 100644
--- a/components/ListWithIconForm.ui.qml
+++ b/components/ListWithIconForm.ui.qml
@@ -5,41 +5,39 @@ import QtQuick.Layouts 1.15
Item {
property alias button: listButton
- width: 360
- height: 48
- Layout.minimumWidth: 360
- Layout.minimumHeight: 48
+ width: 360
+ height: 48
+ Layout.minimumWidth: 360
+ Layout.minimumHeight: 48
- Row {
- id: row
- anchors.fill: parent
- spacing: 8
- padding: 0
+ Item {
+ id: row
+ anchors.fill: parent
- Label {
- id: listLabel
- text: qsTr("List label with icon")
- anchors.verticalCenter: parent.verticalCenter
- anchors.left: parent.left
- font.letterSpacing: 0.15
- font.weight: Font.Medium
- anchors.leftMargin: 16
- font.pointSize: 16
- }
+ Label {
+ id: listLabel
+ text: qsTr("List label with icon")
+ anchors.verticalCenter: parent.verticalCenter
+ anchors.left: parent.left
+ font.letterSpacing: 0.15
+ font.weight: Font.Medium
+ anchors.leftMargin: 16
+ font.pointSize: 16
+ }
- ToolButton {
- id: listButton
- width: 24
- height: 24
- text: qsTr("List Tool Button")
- anchors.verticalCenter: parent.verticalCenter
- anchors.right: parent.right
- padding: 0
- display: AbstractButton.IconOnly
- highlighted: false
- anchors.rightMargin: 16
- icon.name: "addIcon"
- icon.source: "../icons/add-24px.svg"
- }
- }
+ ToolButton {
+ id: listButton
+ width: 24
+ height: 24
+ text: qsTr("List Tool Button")
+ anchors.verticalCenter: parent.verticalCenter
+ anchors.right: parent.right
+ padding: 0
+ display: AbstractButton.IconOnly
+ highlighted: false
+ anchors.rightMargin: 16
+ icon.name: "addIcon"
+ icon.source: "../icons/add-24px.svg"
+ }
+ }
}
diff --git a/components/ProductCardForm.ui.qml b/components/ProductCardForm.ui.qml
index d7cc671..b355b9c 100644
--- a/components/ProductCardForm.ui.qml
+++ b/components/ProductCardForm.ui.qml
@@ -8,133 +8,123 @@ Item {
property alias nameLabel: productTitle
property alias priceLabel: productAmount
- width: 360
- height: 80
+ width: 360
+ height: 80
- Rectangle {
- id: productCardBg
- color: "#1fffffff"
- radius: 8
- border.width: 0
- anchors.fill: parent
+ Rectangle {
+ id: productCardBg
+ color: "#1fffffff"
+ radius: 8
+ border.width: 0
+ anchors.fill: parent
- Row {
- id: productCardRow
- anchors.fill: parent
- spacing: 8
+ Item {
+ id: productCardRow
+ anchors.fill: parent
- ToolButton {
- id: productCardMoreButton
- width: 24
- height: 24
- text: qsTr("Tool Button")
- anchors.right: parent.right
- anchors.top: parent.top
- padding: 0
- anchors.topMargin: 8
- display: AbstractButton.IconOnly
- anchors.rightMargin: 8
- icon.source: "../icons/more-vert-24px.svg"
- }
+ Image {
+ id: imageCardPreview
+ width: 64
+ source: "qrc:/qtquickplugin/images/template_image.png"
+ anchors.bottomMargin: 8
+ anchors.left: parent.left
+ anchors.top: parent.top
+ anchors.bottom: parent.bottom
+ anchors.leftMargin: 8
+ anchors.topMargin: 8
+ layer.enabled: true
+ layer.effect: OpacityMask {
+ maskSource: Rectangle {
+ anchors.centerIn: parent
+ width: imageCardPreview.width
+ height: imageCardPreview.height
+ radius: 8
+ }
+ }
+ }
- Column {
- id: column
- anchors.left: imageCardPreview.right
- anchors.right: productCardMoreButton.left
- anchors.top: parent.top
- anchors.bottom: parent.bottom
- anchors.bottomMargin: 8
- anchors.rightMargin: 16
- anchors.leftMargin: 8
- anchors.topMargin: 8
+ Item {
+ id: column
+ anchors.left: imageCardPreview.right
+ anchors.top: parent.top
+ anchors.bottom: parent.bottom
+ anchors.bottomMargin: 8
+ anchors.rightMargin: 16
+ anchors.leftMargin: 8
+ anchors.topMargin: 8
- Label {
- id: productTitle
- text: qsTr("Product title")
- anchors.left: parent.left
- anchors.right: parent.right
- font.letterSpacing: 0.25
- anchors.rightMargin: 0
- anchors.leftMargin: 0
- font.kerning: false
- font.pointSize: 14
- }
+ Label {
+ id: productTitle
+ text: qsTr("Product title")
+ anchors.top: parent.top
+ anchors.left: parent.left
+ font.letterSpacing: 0.25
+ anchors.rightMargin: 0
+ anchors.leftMargin: 0
+ font.kerning: false
+ font.pointSize: 14
+ }
- RowLayout {
- id: rowLayout
- anchors.left: parent.left
- anchors.right: parent.right
- anchors.top: productTitle.bottom
- anchors.topMargin: 8
- spacing: 8
- anchors.rightMargin: 0
- anchors.leftMargin: 0
+ RowLayout {
+ id: rowLayout
+ anchors.left: parent.left
+ anchors.bottom: priceLayout.top
+ anchors.bottomMargin: 0
+ spacing: 8
+ anchors.leftMargin: 0
- Label {
- id: stock
- color: "#99ffffff"
- text: qsTr("Stock")
- font.letterSpacing: 0.4
- font.pointSize: 12
- font.family: "Roboto Mono"
- }
- Label {
- id: remainingStock
- color: "#99ffffff"
- text: qsTr("1,234,567")
- font.letterSpacing: 0.4
- Layout.fillWidth: true
- font.pointSize: 12
- font.family: "Roboto Mono"
- }
- }
- RowLayout {
- anchors.left: parent.left
- anchors.right: parent.right
- anchors.bottom: parent.bottom
- spacing: 8
- anchors.rightMargin: 0
- anchors.leftMargin: 0
- anchors.bottomMargin: 0
- Label {
- id: productCurrency
- text: qsTr("Rp")
- anchors.left: parent.left
- anchors.bottom: parent.bottom
- font.letterSpacing: 0.25
- anchors.leftMargin: 0
- anchors.bottomMargin: 0
- }
- Label {
- id: productAmount
- text: qsTr("1,234,567")
- font.letterSpacing: 0.25
- Layout.fillWidth: true
- anchors.leftMargin: 0
- }
- }
- }
+ Label {
+ id: stock
+ color: "#99ffffff"
+ text: qsTr("Stock")
+ font.letterSpacing: 0.4
+ font.pointSize: 12
+ font.family: "Roboto Mono"
+ }
+ Label {
+ id: remainingStock
+ color: "#99ffffff"
+ text: qsTr("1,234,567")
+ font.letterSpacing: 0.4
+ Layout.fillWidth: true
+ font.pointSize: 12
+ font.family: "Roboto Mono"
+ }
+ }
+ RowLayout {
+ id: priceLayout
+ anchors.left: parent.left
+ anchors.bottom: parent.bottom
+ spacing: 8
+ anchors.leftMargin: 0
+ anchors.bottomMargin: 0
+ Label {
+ id: productCurrency
+ text: qsTr("Rp")
+ font.letterSpacing: 0.25
+ }
+ Label {
+ id: productAmount
+ text: qsTr("1,234,567")
+ font.letterSpacing: 0.25
+ Layout.fillWidth: true
+ }
+ }
+ }
- Image {
- id: imageCardPreview
- width: 64
- source: "qrc:/qtquickplugin/images/template_image.png"
- anchors.bottomMargin: 8
- anchors.left: parent.left
- anchors.top: parent.top
- anchors.bottom: parent.bottom
- anchors.leftMargin: 8
- anchors.topMargin: 8
- layer.enabled: true
- layer.effect: OpacityMask {
- maskSource: Rectangle {
- anchors.centerIn: parent
- width: imageCardPreview.width
- height: imageCardPreview.height
- radius: 8
- }
- }
- }
- }
- }
+ ToolButton {
+ id: productCardMoreButton
+ width: 24
+ height: 24
+ text: qsTr("Tool Button")
+ anchors.right: parent.right
+ anchors.top: parent.top
+ padding: 0
+ anchors.topMargin: 8
+ display: AbstractButton.IconOnly
+ anchors.rightMargin: 8
+ icon.source: "../icons/more-vert-24px.svg"
+ }
+ }
+ }
}
generated by cgit v1.2.3 (git 2.25.1) at 2024-11-01 02:20:53 +0000