Merge pull request #8894 from nextcloud/bugfix/AllignPlusIcon

Fix some of the accounts menu visual issues
This commit is contained in:
Tamás Bari 2025-10-20 16:19:31 +02:00 committed by GitHub
commit e738580d5b
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 68 additions and 29 deletions

View File

@ -53,7 +53,9 @@ Button {
x: (root.x + 2)
y: (root.y + Style.trayWindowHeaderHeight + 2)
width: (Style.rootWidth - 2)
property real widestMenuItemWidth: 0
property real maximumWidthAllowed: trayWindowHeader.width - (root.x + 4)
width: Math.min( widestMenuItemWidth + leftPadding + rightPadding, maximumWidthAllowed )
height: Math.min(implicitHeight, maxMenuHeight)
closePolicy: Menu.CloseOnPressOutsideParent | Menu.CloseOnEscape
@ -71,7 +73,27 @@ Button {
implicitHeight: instantiatedUserLine.height
UserLine {
id: instantiatedUserLine
width: parent.width
width: Math.min(accountMenu.widestMenuItemWidth, accountMenu.maximumWidthAllowed)
Component.onCompleted: {
instantiatedUserLine.updateMenuWidth()
}
onImplicitWidthChanged: {
instantiatedUserLine.updateMenuWidth()
}
Connections {
target: model
function onNameChanged() {
instantiatedUserLine.updateMenuWidth()
}
function onStatusChanged() {
instantiatedUserLine.updateMenuWidth()
}
}
onShowUserStatusSelector: {
userStatusDrawer.openUserStatusDrawer(model.index);
accountMenu.close();
@ -81,6 +103,11 @@ Button {
accountMenu.close();
}
onClicked: UserModel.currentUserId = model.index;
function updateMenuWidth()
{
accountMenu.widestMenuItemWidth = Math.max( instantiatedUserLine.implicitWidth, accountMenu.widestMenuItemWidth )
}
}
}
onObjectAdded: function(index, object) {
@ -95,21 +122,21 @@ Button {
id: addAccountButton
hoverEnabled: true
visible: Systray.enableAddAccount
implicitHeight: Style.accountAvatarSize
implicitHeight: Style.trayWindowHeaderHeight
readonly property real addAccountIconSize: Style.accountAvatarSize * Style.smallIconScaleFactor
readonly property real addAccountHorizontalOffset: (Style.accountAvatarSize - addAccountIconSize) / 2
readonly property real addAccountHorizontalOffset: ( (Style.accountAvatarSize - addAccountIconSize) / 2 ) + Style.accountIconsMenuMargin
property var iconColor: !addAccountButton.enabled
? addAccountButton.palette.mid
: (addAccountButton.highlighted || addAccountButton.down
: ((addAccountButton.highlighted || addAccountButton.down) && Qt.platform.os !== "windows"
? addAccountButton.palette.highlightedText
: addAccountButton.palette.text)
icon.source: "image://svgimage-custom-color/add.svg/" + iconColor
icon.width: addAccountIconSize
icon.height: addAccountIconSize
leftPadding: Style.accountIconsMenuMargin + addAccountHorizontalOffset
spacing: Style.userLineSpacing + addAccountHorizontalOffset
leftPadding: addAccountHorizontalOffset
spacing: Style.userLineSpacing
text: qsTr("Add account")
onClicked: UserModel.addAccount()
@ -140,7 +167,7 @@ Button {
elide: Text.ElideRight
color: !parent.enabled
? parent.palette.mid
: (parent.highlighted || parent.down
: ((parent.highlighted || parent.down) && Qt.platform.os !== "windows"
? parent.palette.highlightedText
: parent.palette.text)
}
@ -164,7 +191,7 @@ Button {
elide: Text.ElideRight
color: !parent.enabled
? parent.palette.mid
: (parent.highlighted || parent.down
: ((parent.highlighted || parent.down) && Qt.platform.os !== "windows"
? parent.palette.highlightedText
: parent.palette.text)
}
@ -188,7 +215,7 @@ Button {
elide: Text.ElideRight
color: !parent.enabled
? parent.palette.mid
: (parent.highlighted || parent.down
: ((parent.highlighted || parent.down) && Qt.platform.os !== "windows"
? parent.palette.highlightedText
: parent.palette.text)
}

View File

@ -81,7 +81,7 @@ AbstractButton {
color: !userLine.parent.enabled
? userLine.parent.palette.mid
: (userLine.parent.highlighted || userLine.parent.down
: ((userLine.parent.highlighted || userLine.parent.down) && Qt.platform.os !== "windows"
? userLine.parent.palette.highlightedText
: userLine.parent.palette.text)
}
@ -101,7 +101,7 @@ AbstractButton {
color: !userLine.parent.enabled
? userLine.parent.palette.mid
: (userLine.parent.highlighted || userLine.parent.down
: ((userLine.parent.highlighted || userLine.parent.down) && Qt.platform.os !== "windows"
? userLine.parent.palette.highlightedText
: userLine.parent.palette.text)
}
@ -116,7 +116,7 @@ AbstractButton {
color: !userLine.parent.enabled
? userLine.parent.palette.mid
: (userLine.parent.highlighted || userLine.parent.down
: ((userLine.parent.highlighted || userLine.parent.down) && Qt.platform.os !== "windows"
? userLine.parent.palette.highlightedText
: userLine.parent.palette.text)
}
@ -133,12 +133,16 @@ AbstractButton {
color: !userLine.parent.enabled
? userLine.parent.palette.mid
: (userLine.parent.highlighted || userLine.parent.down
: ((userLine.parent.highlighted || userLine.parent.down) && Qt.platform.os !== "windows"
? userLine.parent.palette.highlightedText
: userLine.parent.palette.text)
}
}
Item { // Spacer
Layout.fillWidth: true
}
Button {
id: userMoreButton
Layout.preferredWidth: Style.headerButtonIconSize
@ -153,7 +157,7 @@ AbstractButton {
property var iconColor: !userLine.parent.enabled
? userLine.parent.palette.mid
: (!hovered && (userLine.parent.highlighted || userLine.parent.down)
: (!hovered && ((userLine.parent.highlighted || userLine.parent.down) && Qt.platform.os !== "windows")
? userLine.parent.palette.highlightedText
: userLine.parent.palette.text)
icon.source: "image://svgimage-custom-color/more.svg/" + iconColor
@ -161,41 +165,45 @@ AbstractButton {
AutoSizingMenu {
id: userMoreButtonMenu
closePolicy: Menu.CloseOnPressOutsideParent | Menu.CloseOnEscape
height: implicitHeight
MenuItem {
visible: model.isConnected && model.serverHasUserStatus
height: visible ? implicitHeight : 0
id: setStatusButton
enabled: model.isConnected && model.serverHasUserStatus
text: qsTr("Set status")
font.pixelSize: Style.topLinePixelSize
hoverEnabled: true
onClicked: showUserStatusSelector(index)
Accessible.role: Accessible.Button
Accessible.name: text
Accessible.onPressAction: setStatusButton.clicked()
}
MenuItem {
visible: model.isConnected && model.serverHasUserStatus
height: visible ? implicitHeight : 0
id: statusMessageButton
enabled: model.isConnected && model.serverHasUserStatus
text: qsTr("Status message")
font.pixelSize: Style.topLinePixelSize
hoverEnabled: true
onClicked: showUserStatusMessageSelector(index)
Accessible.role: Accessible.Button
Accessible.name: text
Accessible.onPressAction: statusMessageButton.clicked()
}
MenuItem {
id: logInOutButton
enabled: model.canLogout
text: model.isConnected ? qsTr("Log out") : qsTr("Log in")
visible: model.canLogout
height: visible ? implicitHeight : 0
width: parent.width
font.pixelSize: Style.topLinePixelSize
hoverEnabled: true
onClicked: {
model.isConnected ? UserModel.logout(index) : UserModel.login(index)
accountMenu.close()
}
Accessible.role: Accessible.Button
Accessible.name: model.isConnected ? qsTr("Log out") : qsTr("Log in")
onPressed: {
if (model.isConnected) {
UserModel.logout(index)
} else {
@ -203,6 +211,10 @@ AbstractButton {
}
accountMenu.close()
}
Accessible.role: Accessible.Button
Accessible.name: text
Accessible.onPressAction: logInOutButton.clicked()
}
MenuItem {