mirror of
https://invent.kde.org/marcoa/a-la-karte.git
synced 2026-02-09 21:13:08 +00:00
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.
This commit is contained in:
parent
ccffb1e49c
commit
95a3c20436
1 changed files with 29 additions and 130 deletions
|
|
@ -313,7 +313,12 @@ Kirigami.OverlaySheet {
|
||||||
|
|
||||||
Item { Layout.fillHeight: true }
|
Item { Layout.fillHeight: true }
|
||||||
|
|
||||||
|
ColumnLayout {
|
||||||
|
Layout.fillWidth: true
|
||||||
|
spacing: Kirigami.Units.smallSpacing
|
||||||
|
|
||||||
RowLayout {
|
RowLayout {
|
||||||
|
Layout.fillWidth: true
|
||||||
spacing: Kirigami.Units.smallSpacing
|
spacing: Kirigami.Units.smallSpacing
|
||||||
|
|
||||||
QQC2.Button {
|
QQC2.Button {
|
||||||
|
|
@ -331,77 +336,25 @@ Kirigami.OverlaySheet {
|
||||||
}
|
}
|
||||||
|
|
||||||
Item { Layout.fillWidth: true }
|
Item { Layout.fillWidth: true }
|
||||||
|
}
|
||||||
|
|
||||||
RowLayout {
|
Flow {
|
||||||
|
Layout.fillWidth: true
|
||||||
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()
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue