From 95a3c20436ee8bfa2fae48af3428cf7a2765ea51 Mon Sep 17 00:00:00 2001 From: Marco Allegretti Date: Tue, 20 Jan 2026 11:00:09 +0100 Subject: [PATCH] Improve game action discoverability Show Favorite/Hide/Edit/Remove as labeled buttons in the game details sheet so actions remain visible and accessible even on narrow layouts. --- src/qml/GameDetailsSheet.qml | 159 +++++++---------------------------- 1 file changed, 29 insertions(+), 130 deletions(-) diff --git a/src/qml/GameDetailsSheet.qml b/src/qml/GameDetailsSheet.qml index 3217b3e..b55dbe4 100644 --- a/src/qml/GameDetailsSheet.qml +++ b/src/qml/GameDetailsSheet.qml @@ -313,95 +313,48 @@ Kirigami.OverlaySheet { Item { Layout.fillHeight: true } - RowLayout { + ColumnLayout { + Layout.fillWidth: true spacing: Kirigami.Units.smallSpacing - 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 + RowLayout { + Layout.fillWidth: true + spacing: Kirigami.Units.smallSpacing - 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() - Keys.onEnterPressed: clicked() + onClicked: detailsSheet.launchRequested() + + Keys.onReturnPressed: clicked() + Keys.onEnterPressed: clicked() + } + + Item { Layout.fillWidth: true } } - Item { Layout.fillWidth: true } - - RowLayout { + Flow { + Layout.fillWidth: true spacing: Kirigami.Units.smallSpacing QQC2.Button { icon.name: game && game.favorite ? "bookmark-remove" : "bookmark-new" text: game && game.favorite ? i18n("Unfavorite") : i18n("Favorite") - display: QQC2.AbstractButton.IconOnly - implicitWidth: detailsSheet.actionIconButtonSize - 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 - + display: detailsSheet.useCompactLayout ? QQC2.AbstractButton.TextUnderIcon : QQC2.AbstractButton.TextBesideIcon + enabled: !!game onClicked: if (game) game.favorite = !game.favorite } QQC2.Button { icon.name: game && game.hidden ? "view-visible" : "view-hidden" text: game && game.hidden ? i18n("Unhide") : i18n("Hide") - display: QQC2.AbstractButton.IconOnly - implicitWidth: detailsSheet.actionIconButtonSize - 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 - + display: detailsSheet.useCompactLayout ? QQC2.AbstractButton.TextUnderIcon : QQC2.AbstractButton.TextBesideIcon + enabled: !!game onClicked: if (game) { game.hidden = !game.hidden App.saveLibrary() @@ -411,70 +364,16 @@ Kirigami.OverlaySheet { QQC2.Button { icon.name: "document-edit" text: i18n("Edit") - display: QQC2.AbstractButton.IconOnly - implicitWidth: detailsSheet.actionIconButtonSize - 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 - + display: detailsSheet.useCompactLayout ? QQC2.AbstractButton.TextUnderIcon : QQC2.AbstractButton.TextBesideIcon + enabled: !!game onClicked: detailsSheet.editRequested() } QQC2.Button { icon.name: "edit-delete" text: i18n("Remove") - display: QQC2.AbstractButton.IconOnly - implicitWidth: detailsSheet.actionIconButtonSize - 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 - + display: detailsSheet.useCompactLayout ? QQC2.AbstractButton.TextUnderIcon : QQC2.AbstractButton.TextBesideIcon + enabled: !!game onClicked: detailsSheet.removeRequested() } }