marcoallegretti/a-la-karte
1
0
Fork 0
mirror of https://invent.kde.org/marcoa/a-la-karte.git synced 2026-02-09 21:13:08 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Improve game action discoverability

Browse source 
Show Favorite/Hide/Edit/Remove as labeled buttons in the game details sheet so actions remain visible and accessible even on narrow layouts.
This commit is contained in:
Marco Allegretti 2026-01-20 11:00:09 +01:00
parent ccffb1e49c
commit 95a3c20436
1 changed files with 29 additions and 130 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

159
src/qml/GameDetailsSheet.qml
View file

@ -313,95 +313,48 @@ Kirigami.OverlaySheet {
Item { Layout.fillHeight: true } Item { Layout.fillHeight: true }
RowLayout { ColumnLayout {
Layout.fillWidth: true
spacing: Kirigami.Units.smallSpacing spacing: Kirigami.Units.smallSpacing
QQC2.Button { RowLayout {
id: playButton Layout.fillWidth: true
text: game && game.running ? i18n("Running...") : i18n("Play") spacing: Kirigami.Units.smallSpacing
icon.name: "media-playback-start"
enabled: game && !game.running
highlighted: true
focus: true
onClicked: detailsSheet.launchRequested() QQC2.Button {
id: playButton
text: game && game.running ? i18n("Running...") : i18n("Play")
icon.name: "media-playback-start"
enabled: game && !game.running
highlighted: true
focus: true
Keys.onReturnPressed: clicked() onClicked: detailsSheet.launchRequested()
Keys.onEnterPressed: clicked()
Keys.onReturnPressed: clicked()
Keys.onEnterPressed: clicked()
}
Item { Layout.fillWidth: true }
} }
Item { Layout.fillWidth: true } Flow {
Layout.fillWidth: true
RowLayout {
spacing: Kirigami.Units.smallSpacing spacing: Kirigami.Units.smallSpacing
QQC2.Button { QQC2.Button {
icon.name: game && game.favorite ? "bookmark-remove" : "bookmark-new" icon.name: game && game.favorite ? "bookmark-remove" : "bookmark-new"
text: game && game.favorite ? i18n("Unfavorite") : i18n("Favorite") text: game && game.favorite ? i18n("Unfavorite") : i18n("Favorite")
display: QQC2.AbstractButton.IconOnly display: detailsSheet.useCompactLayout ? QQC2.AbstractButton.TextUnderIcon : QQC2.AbstractButton.TextBesideIcon
implicitWidth: detailsSheet.actionIconButtonSize enabled: !!game
implicitHeight: detailsSheet.actionIconButtonSize
icon.width: Kirigami.Units.iconSizes.smallMedium
icon.height: Kirigami.Units.iconSizes.smallMedium
hoverEnabled: true
flat: true
padding: 0
background: Rectangle {
radius: Kirigami.Units.smallSpacing
color: parent.activeFocus ? Kirigami.Theme.highlightColor : Kirigami.Theme.alternateBackgroundColor
opacity: parent.activeFocus ? 0.18 : (parent.hovered ? 0.08 : 0.0)
border.width: parent.activeFocus ? 1 : 0
border.color: Kirigami.Theme.highlightColor
Behavior on opacity {
NumberAnimation { duration: Kirigami.Units.shortDuration }
}
Behavior on border.width {
NumberAnimation { duration: Kirigami.Units.shortDuration }
}
}
QQC2.ToolTip.text: text
QQC2.ToolTip.visible: hovered
QQC2.ToolTip.delay: Kirigami.Units.toolTipDelay
onClicked: if (game) game.favorite = !game.favorite onClicked: if (game) game.favorite = !game.favorite
} }
QQC2.Button { QQC2.Button {
icon.name: game && game.hidden ? "view-visible" : "view-hidden" icon.name: game && game.hidden ? "view-visible" : "view-hidden"
text: game && game.hidden ? i18n("Unhide") : i18n("Hide") text: game && game.hidden ? i18n("Unhide") : i18n("Hide")
display: QQC2.AbstractButton.IconOnly display: detailsSheet.useCompactLayout ? QQC2.AbstractButton.TextUnderIcon : QQC2.AbstractButton.TextBesideIcon
implicitWidth: detailsSheet.actionIconButtonSize enabled: !!game
implicitHeight: detailsSheet.actionIconButtonSize
icon.width: Kirigami.Units.iconSizes.smallMedium
icon.height: Kirigami.Units.iconSizes.smallMedium
hoverEnabled: true
flat: true
padding: 0
background: Rectangle {
radius: Kirigami.Units.smallSpacing
color: parent.activeFocus ? Kirigami.Theme.highlightColor : Kirigami.Theme.alternateBackgroundColor
opacity: parent.activeFocus ? 0.18 : (parent.hovered ? 0.08 : 0.0)
border.width: parent.activeFocus ? 1 : 0
border.color: Kirigami.Theme.highlightColor
Behavior on opacity {
NumberAnimation { duration: Kirigami.Units.shortDuration }
}
Behavior on border.width {
NumberAnimation { duration: Kirigami.Units.shortDuration }
}
}
QQC2.ToolTip.text: text
QQC2.ToolTip.visible: hovered
QQC2.ToolTip.delay: Kirigami.Units.toolTipDelay
onClicked: if (game) { onClicked: if (game) {
game.hidden = !game.hidden game.hidden = !game.hidden
App.saveLibrary() App.saveLibrary()
@ -411,70 +364,16 @@ Kirigami.OverlaySheet {
QQC2.Button { QQC2.Button {
icon.name: "document-edit" icon.name: "document-edit"
text: i18n("Edit") text: i18n("Edit")
display: QQC2.AbstractButton.IconOnly display: detailsSheet.useCompactLayout ? QQC2.AbstractButton.TextUnderIcon : QQC2.AbstractButton.TextBesideIcon
implicitWidth: detailsSheet.actionIconButtonSize enabled: !!game
implicitHeight: detailsSheet.actionIconButtonSize
icon.width: Kirigami.Units.iconSizes.smallMedium
icon.height: Kirigami.Units.iconSizes.smallMedium
hoverEnabled: true
flat: true
padding: 0
background: Rectangle {
radius: Kirigami.Units.smallSpacing
color: parent.activeFocus ? Kirigami.Theme.highlightColor : Kirigami.Theme.alternateBackgroundColor
opacity: parent.activeFocus ? 0.18 : (parent.hovered ? 0.08 : 0.0)
border.width: parent.activeFocus ? 1 : 0
border.color: Kirigami.Theme.highlightColor
Behavior on opacity {
NumberAnimation { duration: Kirigami.Units.shortDuration }
}
Behavior on border.width {
NumberAnimation { duration: Kirigami.Units.shortDuration }
}
}
QQC2.ToolTip.text: text
QQC2.ToolTip.visible: hovered
QQC2.ToolTip.delay: Kirigami.Units.toolTipDelay
onClicked: detailsSheet.editRequested() onClicked: detailsSheet.editRequested()
} }
QQC2.Button { QQC2.Button {
icon.name: "edit-delete" icon.name: "edit-delete"
text: i18n("Remove") text: i18n("Remove")
display: QQC2.AbstractButton.IconOnly display: detailsSheet.useCompactLayout ? QQC2.AbstractButton.TextUnderIcon : QQC2.AbstractButton.TextBesideIcon
implicitWidth: detailsSheet.actionIconButtonSize enabled: !!game
implicitHeight: detailsSheet.actionIconButtonSize
icon.width: Kirigami.Units.iconSizes.smallMedium
icon.height: Kirigami.Units.iconSizes.smallMedium
hoverEnabled: true
flat: true
padding: 0
background: Rectangle {
radius: Kirigami.Units.smallSpacing
color: parent.activeFocus ? Kirigami.Theme.highlightColor : Kirigami.Theme.alternateBackgroundColor
opacity: parent.activeFocus ? 0.18 : (parent.hovered ? 0.08 : 0.0)
border.width: parent.activeFocus ? 1 : 0
border.color: Kirigami.Theme.highlightColor
Behavior on opacity {
NumberAnimation { duration: Kirigami.Units.shortDuration }
}
Behavior on border.width {
NumberAnimation { duration: Kirigami.Units.shortDuration }
}
}
QQC2.ToolTip.text: text
QQC2.ToolTip.visible: hovered
QQC2.ToolTip.delay: Kirigami.Units.toolTipDelay
onClicked: detailsSheet.removeRequested() onClicked: detailsSheet.removeRequested()
} }
} }