SessionMenu: more compact layout

This commit is contained in:
lysec
2025-10-15 13:07:55 +02:00
parent 4981f5561b
commit a542afb204
7 changed files with 31 additions and 103 deletions
+24 -54
View File
@@ -13,8 +13,8 @@ import qs.Widgets
NPanel {
id: root
preferredWidth: 380 * Style.uiScaleRatio
preferredHeight: 440 * Style.uiScaleRatio
preferredWidth: 320 * Style.uiScaleRatio
preferredHeight: 360 * Style.uiScaleRatio
panelAnchorHorizontalCenter: true
panelAnchorVerticalCenter: true
panelKeyboardFocus: true
@@ -30,33 +30,27 @@ NPanel {
readonly property var powerOptions: [{
"action": "lock",
"icon": "lock",
"title": I18n.tr("session-menu.lock"),
"subtitle": I18n.tr("session-menu.lock-subtitle")
"title": I18n.tr("session-menu.lock")
}, {
"action": "lockAndSuspend",
"icon": "lock-pause",
"title": I18n.tr("session-menu.lock-and-suspend"),
"subtitle": I18n.tr("session-menu.lock-and-suspend-subtitle")
"title": I18n.tr("session-menu.lock-and-suspend")
}, {
"action": "suspend",
"icon": "suspend",
"title": I18n.tr("session-menu.suspend"),
"subtitle": I18n.tr("session-menu.suspend-subtitle")
"title": I18n.tr("session-menu.suspend")
}, {
"action": "reboot",
"icon": "reboot",
"title": I18n.tr("session-menu.reboot"),
"subtitle": I18n.tr("session-menu.reboot-subtitle")
"title": I18n.tr("session-menu.reboot")
}, {
"action": "logout",
"icon": "logout",
"title": I18n.tr("session-menu.logout"),
"subtitle": I18n.tr("session-menu.logout-subtitle")
"title": I18n.tr("session-menu.logout")
}, {
"action": "shutdown",
"icon": "shutdown",
"title": I18n.tr("session-menu.shutdown"),
"subtitle": I18n.tr("session-menu.shutdown-subtitle"),
"isShutdown": true
}]
@@ -259,16 +253,16 @@ NPanel {
ColumnLayout {
anchors.fill: parent
anchors.topMargin: Style.marginL
anchors.leftMargin: Style.marginL
anchors.rightMargin: Style.marginL
anchors.bottomMargin: Style.marginM
spacing: Style.marginS
anchors.topMargin: Style.marginM
anchors.leftMargin: Style.marginM
anchors.rightMargin: Style.marginM
anchors.bottomMargin: Style.marginS
spacing: Style.marginXS
// Header with title and close button
RowLayout {
Layout.fillWidth: true
Layout.preferredHeight: Style.baseWidgetSize * 0.8
Layout.preferredHeight: Style.baseWidgetSize * 0.6
NText {
text: timerActive ? I18n.tr("session-menu.action-in-seconds", {
@@ -276,7 +270,7 @@ NPanel {
"seconds": Math.ceil(timeRemaining / 1000)
}) : I18n.tr("session-menu.title")
font.weight: Style.fontWeightBold
pointSize: Style.fontSizeL
pointSize: Style.fontSizeM
color: timerActive ? Color.mPrimary : Color.mOnSurface
Layout.alignment: Qt.AlignVCenter
verticalAlignment: Text.AlignVCenter
@@ -310,7 +304,7 @@ NPanel {
// Power options
ColumnLayout {
Layout.fillWidth: true
spacing: Style.marginM
spacing: Style.marginS
Repeater {
model: powerOptions
@@ -318,7 +312,6 @@ NPanel {
Layout.fillWidth: true
icon: modelData.icon
title: modelData.title
subtitle: modelData.subtitle
isShutdown: modelData.isShutdown || false
isSelected: index === selectedIndex
onClicked: {
@@ -338,14 +331,13 @@ NPanel {
property string icon: ""
property string title: ""
property string subtitle: ""
property bool pending: false
property bool isShutdown: false
property bool isSelected: false
signal clicked
height: Style.baseWidgetSize * 1.6 * Style.uiScaleRatio
height: Style.baseWidgetSize * 1.2 * Style.uiScaleRatio
radius: Style.radiusS
color: {
if (pending) {
@@ -368,7 +360,7 @@ NPanel {
Item {
anchors.fill: parent
anchors.margins: Style.marginL
anchors.margins: Style.marginM
// Icon on the left
NIcon {
@@ -385,8 +377,8 @@ NPanel {
return Color.mOnTertiary
return Color.mOnSurface
}
pointSize: Style.fontSizeXXXL
width: Style.baseWidgetSize * 0.6
pointSize: Style.fontSizeXXL
width: Style.baseWidgetSize * 0.5
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
@@ -402,14 +394,14 @@ NPanel {
anchors.left: iconElement.right
anchors.right: pendingIndicator.visible ? pendingIndicator.left : parent.right
anchors.verticalCenter: parent.verticalCenter
anchors.leftMargin: Style.marginXL
anchors.leftMargin: Style.marginL
anchors.rightMargin: pendingIndicator.visible ? Style.marginM : 0
spacing: 0
NText {
text: buttonRoot.title
font.weight: Style.fontWeightMedium
pointSize: Style.fontSizeM
pointSize: Style.fontSizeS
color: {
if (buttonRoot.pending)
return Color.mPrimary
@@ -426,28 +418,6 @@ NPanel {
}
}
}
NText {
text: {
if (buttonRoot.pending) {
return I18n.tr("session-menu.click-again")
}
return buttonRoot.subtitle
}
pointSize: Style.fontSizeXS
color: {
if (buttonRoot.pending)
return Color.mPrimary
if (buttonRoot.isShutdown && !buttonRoot.isSelected && !mouseArea.containsMouse)
return Color.mError
if (buttonRoot.isSelected || mouseArea.containsMouse)
return Color.mOnTertiary
return Color.mOnSurfaceVariant
}
opacity: Style.opacityHeavy
wrapMode: Text.NoWrap
elide: Text.ElideRight
}
}
// Pending indicator on the right
@@ -455,8 +425,8 @@ NPanel {
id: pendingIndicator
anchors.right: parent.right
anchors.verticalCenter: parent.verticalCenter
width: 24
height: 24
width: 20
height: 20
radius: width * 0.5
color: Color.mPrimary
visible: buttonRoot.pending
@@ -464,7 +434,7 @@ NPanel {
NText {
anchors.centerIn: parent
text: Math.ceil(timeRemaining / 1000)
pointSize: Style.fontSizeS
pointSize: Style.fontSizeXS
font.weight: Style.fontWeightBold
color: Color.mOnPrimary
}