Add help buttons

This commit is contained in:
Daniel 2026-06-22 19:04:33 +02:00
parent 8ae4c07b4b
commit 67939f3604
6 changed files with 84 additions and 4 deletions

View File

@ -0,0 +1,59 @@
import QtQuick
import QtQuick.Controls
import Logos.Theme
import Logos.Controls
// Small circled-"i" help button. Click to toggle a popup with `text`, a short
// description of the operation. Styled to match the other SVG icon buttons.
Item {
id: root
property string text: ""
implicitWidth: 28
implicitHeight: 28
Button {
id: btn
anchors.fill: parent
display: AbstractButton.IconOnly
flat: true
padding: 4
icon.source: Qt.resolvedUrl("../icons/info.svg")
icon.width: 18
icon.height: 18
icon.color: (btn.hovered || popup.visible)
? Theme.palette.primary
: Theme.palette.textTertiary
onClicked: popup.visible ? popup.close() : popup.open()
ToolTip.visible: btn.hovered && !popup.visible
ToolTip.text: qsTr("What is this?")
}
Popup {
id: popup
// Right-aligned to the button, opening downward.
x: root.width - width
y: root.height + Theme.spacing.tiny
width: 300
padding: Theme.spacing.medium
modal: false
focus: true
closePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutside
background: Rectangle {
color: Theme.palette.backgroundSecondary
border.color: Theme.palette.border
border.width: 1
radius: Theme.spacing.radiusLarge
}
contentItem: LogosText {
text: root.text
wrapMode: Text.WordWrap
font.pixelSize: Theme.typography.secondaryText
color: Theme.palette.text
}
}
}

1
src/qml/icons/info.svg Normal file
View File

@ -0,0 +1 @@
<svg fill="none" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path d="m11 7h2v2h-2zm0 4h2v6h-2zm1-9c-5.52 0-10 4.48-10 10s4.48 10 10 10 10-4.48 10-10-4.48-10-10-10zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8z" fill="#000"/></svg>

After

Width:  |  Height:  |  Size: 278 B

View File

@ -49,6 +49,10 @@ ColumnLayout {
padding: Theme.spacing.small
onClicked: root.refreshAccountsRequested()
}
InfoButton {
Layout.alignment: Qt.AlignVCenter
text: qsTr("Your wallet addresses and balances. Press Refresh to fetch the latest known addresses and their balances from the running node.")
}
}
LogosText {

View File

@ -209,6 +209,10 @@ ColumnLayout {
font.pixelSize: Theme.typography.secondaryText
color: Theme.palette.textSecondary
}
InfoButton {
Layout.alignment: Qt.AlignVCenter
text: qsTr("Deposit wallet notes (UTXOs) into a channel. Pick an address to load its notes, select the notes to consume, fill in the channel id, change/funding keys and max fee, then confirm to submit.")
}
}
LogosText {

View File

@ -86,6 +86,10 @@ ColumnLayout {
font.pixelSize: Theme.typography.secondaryText
color: Theme.palette.textSecondary
}
InfoButton {
Layout.alignment: Qt.AlignVCenter
text: qsTr("Claim block-leader rewards. The list shows your pending claimable vouchers (refreshed each block). Claim submits a claim transaction; the protocol selects which voucher it consumes.")
}
}
// Horizontally-sliding list of voucher cards.

View File

@ -40,10 +40,18 @@ ColumnLayout {
anchors.margins: Theme.spacing.large
spacing: Theme.spacing.small
LogosText {
text: qsTr("Transfer funds")
font.pixelSize: Theme.typography.secondaryText
font.bold: true
RowLayout {
Layout.fillWidth: true
LogosText {
text: qsTr("Transfer funds")
font.pixelSize: Theme.typography.secondaryText
font.bold: true
}
Item { Layout.fillWidth: true }
InfoButton {
Layout.alignment: Qt.AlignVCenter
text: qsTr("Send funds between addresses. Choose a source address (its balance is shown), enter the recipient key and amount, then press Send.")
}
}
StyledAddressComboBox {