Merge pull request #7142 from nextcloud/bugfix/native-ui

Fix alignment and size of buttons.

src/gui/filedetails/FileDetailsPage.qml

@@ -134,11 +134,14 @@ Page {
                 id: closeButton
 
                 Layout.rowSpan: headerGridLayout.rows
-                Layout.preferredWidth: Style.iconButtonWidth
-                Layout.preferredHeight: width
+                Layout.preferredWidth: Style.activityListButtonWidth
+                Layout.preferredHeight: Style.activityListButtonHeight
+                Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
                 Layout.rightMargin: headerGridLayout.textRightMargin
 
                 icon.source: "image://svgimage-custom-color/clear.svg" + "/" + palette.buttonText
+                icon.width: Style.activityListButtonIconSize
+                icon.height: Style.activityListButtonIconSize
                 toolTipText: qsTr("Dismiss")
 
                 visible: root.showCloseButton

src/gui/filedetails/ShareDelegate.qml

@@ -186,9 +186,9 @@ GridLayout {
 
             property bool shareLinkCopied: false
 
-            Layout.alignment: Qt.AlignCenter
-            Layout.preferredWidth: shareLinkCopied ? implicitWidth : Style.iconButtonWidth
-            Layout.preferredHeight: Style.iconButtonWidth
+            Layout.alignment: Qt.AlignVCenter | Qt.AlignHCenter
+            Layout.preferredWidth: shareLinkCopied ? implicitWidth : Style.activityListButtonWidth
+            Layout.preferredHeight: Style.activityListButtonHeight
 
             toolTipText: qsTr("Copy share link location")
 
@@ -232,15 +232,15 @@ GridLayout {
         CustomButton {
             id: moreButton
 
-            Layout.alignment: Qt.AlignCenter
-            Layout.preferredWidth: Style.iconButtonWidth
-            Layout.preferredHeight: width
-
             toolTipText: qsTr("Share options")
 
+            Layout.preferredWidth: Style.activityListButtonWidth
+            Layout.preferredHeight: Style.activityListButtonHeight
+            Layout.alignment: Qt.AlignVCenter | Qt.AlignHCenter
+
             icon.source: "image://svgimage-custom-color/more.svg/" + palette.buttonText
-            icon.width: Style.smallIconSize
-            icon.height: Style.smallIconSize
+            icon.width: Style.activityListButtonIconSize
+            icon.height: Style.activityListButtonIconSize
 
             visible: !root.isPlaceholderLinkShare && !root.isSecureFileDropPlaceholderLinkShare && !root.isInternalLinkShare
             enabled: visible

src/gui/filedetails/ShareDetailsPage.qml

@@ -224,11 +224,14 @@ Page {
                 id: closeButton
 
                 Layout.rowSpan: headerGridLayout.rows
-                Layout.preferredWidth: Style.iconButtonWidth
-                Layout.preferredHeight: width
+                Layout.preferredWidth: Style.activityListButtonWidth
+                Layout.preferredHeight: Style.activityListButtonHeight
+                Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
                 Layout.rightMargin: root.padding
 
                 icon.source: "image://svgimage-custom-color/clear.svg" + "/" + palette.buttonText
+                icon.width: Style.activityListButtonIconSize
+                icon.height: Style.activityListButtonIconSize
                 toolTipText: qsTr("Dismiss")
 
                 onClicked: root.closeShareDetails()
@@ -764,7 +767,13 @@ Page {
 
             height: Style.standardPrimaryButtonHeight
 
+            Layout.preferredWidth: Style.activityListButtonWidth
+            Layout.preferredHeight: Style.activityListButtonHeight
+            Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
+
             icon.source: "image://svgimage-custom-color/copy.svg/" + palette.brightText
+            icon.width: Style.smallIconSize
+            icon.height: Style.smallIconSize
             text: shareLinkCopied ? qsTr("Share link copied!") : qsTr("Copy share link")
             visible: root.isLinkShare
             enabled: visible

src/gui/tray/ActivityItemContent.qml

@@ -159,11 +159,13 @@ RowLayout {
             CustomButton {
                 id: fileDetailsButton
 
-                Layout.preferredWidth: Style.dismissButtonSize
-                Layout.preferredHeight: Style.dismissButtonSize
-                Layout.alignment: Qt.AlignTop | Qt.AlignRight
+                Layout.preferredWidth: Style.activityListButtonWidth
+                Layout.preferredHeight: Style.activityListButtonHeight
+                Layout.alignment: Qt.AlignVCenter | Qt.AlignHCenter
 
                 icon.source: "image://svgimage-custom-color/more.svg/" + palette.buttonText
+                icon.width: Style.activityListButtonIconSize
+                icon.height: Style.activityListButtonIconSize
 
                 ToolTip {
                     text: qsTr("Open file details")
@@ -171,8 +173,6 @@ RowLayout {
                 }
 
                 display: Button.IconOnly
-                leftPadding: 0
-                rightPadding: 0
 
                 visible: model.showFileDetails
 
@@ -182,17 +182,15 @@ RowLayout {
             CustomButton {
                 id: dismissActionButton
 
-                Layout.preferredWidth: Style.dismissButtonSize
-                Layout.preferredHeight: Style.dismissButtonSize
-                Layout.alignment: Qt.AlignVCenter | Qt.AlignRight
-
-                visible: root.showDismissButton && !fileDetailsButton.visible
+                Layout.preferredWidth: Style.activityListButtonWidth
+                Layout.preferredHeight: Style.activityListButtonHeight
+                Layout.alignment: Qt.AlignVCenter | Qt.AlignHCenter
 
                 icon.source: "image://svgimage-custom-color/clear.svg/" + palette.buttonText
+                icon.width: Style.activityListButtonIconSize
+                icon.height: Style.activityListButtonIconSize
 
                 display: Button.IconOnly
-                leftPadding: 0
-                rightPadding: 0
 
                 ToolTip {
                     text: qsTr("Dismiss")

theme/Style/Style.qml

@@ -105,6 +105,9 @@ QtObject {
 
     property int addAccountButtonHeight: 50
 
+    property int activityListButtonWidth: 42
+    property int activityListButtonHeight: 32
+    property int activityListButtonIconSize: 18
     property int headerButtonIconSize: 32
     property int addButtonIconSize: 26
     property int dismissButtonSize: 26