status-desktop/ui/imports/shared/controls/chat/PaymentRequestMiniCardDeleg...

113 lines
3.6 KiB
QML

import QtQuick 2.15
import QtQuick.Layouts 1.15
import StatusQ.Core.Theme 0.1
import StatusQ.Components 0.1
import StatusQ.Controls 0.1
import StatusQ.Core 0.1
import utils 1.0
CalloutCard {
id: root
required property string amount
required property string symbol
readonly property bool containsMouse: mouseArea.hovered || closeButton.hovered
signal close()
implicitWidth:260
implicitHeight: 64
verticalPadding: 15
horizontalPadding: 12
borderColor: Theme.palette.directColor7
backgroundColor: root.containsMouse ? Theme.palette.directColor7 : Theme.palette.background
contentItem: Item {
implicitHeight: layout.implicitHeight
implicitWidth: layout.implicitWidth
RowLayout {
id: layout
anchors.fill: parent
spacing: 16
StatusRoundIcon {
id: favIcon
Layout.alignment: Qt.AlignLeft | Qt.AlignVCenter
Layout.preferredWidth: 36
Layout.preferredHeight: 36
asset.width: 24
asset.height: 24
asset.bgColor: Theme.palette.directColor7
asset.bgHeight: 36
asset.bgWidth: 36
asset.color: Theme.palette.primaryColor1
asset.name: Theme.svg("send")
StatusSmartIdenticon {
anchors.bottom: parent.bottom
anchors.horizontalCenter: parent.right
asset.width: 16
asset.height: 16
asset.bgColor: root.containsMouse ? Theme.palette.transparent : Theme.palette.background
asset.bgHeight: 20
asset.bgWidth: 20
asset.isImage: true
asset.name: Constants.tokenIcon(root.symbol)
}
}
ColumnLayout {
Layout.fillWidth: true
Layout.fillHeight: true
StatusBaseText {
Layout.fillWidth: true
Layout.fillHeight: true
text: qsTr("Payment request")
font.pixelSize: Theme.additionalTextSize
font.weight: Font.Medium
}
RowLayout {
Layout.fillWidth: true
Layout.fillHeight: true
StatusBaseText {
Layout.maximumWidth: parent.width * 0.8
Layout.fillHeight: true
font.pixelSize: Theme.tertiaryTextFontSize
color: Theme.palette.baseColor1
verticalAlignment: Text.AlignVCenter
elide: Text.ElideRight
text: root.amount
}
StatusBaseText {
Layout.fillHeight: true
font.pixelSize: Theme.tertiaryTextFontSize
color: Theme.palette.baseColor1
verticalAlignment: Text.AlignVCenter
text: root.symbol
}
}
}
StatusFlatButton {
id: closeButton
icon.name: "close"
size: StatusBaseButton.Size.Small
hoverColor: Theme.palette.directColor8
textColor: Theme.palette.directColor1
onClicked: root.close()
}
}
}
HoverHandler {
id: mouseArea
target: background
cursorShape: Qt.PointingHandCursor
}
}