Merge pull request #5741 from nextcloud/backport/5715/stable-3.9

[stable-3.9] Fix tray styling

src/gui/BasicComboBox.qml

@@ -30,7 +30,7 @@ ComboBox {
 
     background: Rectangle {
         radius: Style.slightlyRoundedButtonRadius
-        color: Style.buttonBackgroundColor
+        color: palette.button
         opacity: clearComboBox.hovered ? Style.hoverOpacity : 1.0
     }
 
@@ -39,7 +39,6 @@ ComboBox {
         rightPadding: clearComboBox.indicator.width + clearComboBox.spacing
 
         text: clearComboBox.displayText
-        color: Style.ncTextColor
         verticalAlignment: Text.AlignVCenter
         elide: Text.ElideRight
     }
@@ -50,13 +49,13 @@ ComboBox {
         anchors.verticalCenter: clearComboBox.verticalCenter
 
         cached: true
-        color: Style.ncTextColor
         width: source.width
         height: source.height
+
         source: Image {
             horizontalAlignment: Qt.AlignRight
             verticalAlignment: Qt.AlignVCenter
-            source: "qrc:///client/theme/white/caret-down.svg"
+            source: "image://svgimage-custom-color/caret-down.svg/" + palette.windowText
             sourceSize.width: Style.accountDropDownCaretSize
             sourceSize.height: Style.accountDropDownCaretSize
             Accessible.role: Accessible.PopupMenu
@@ -80,8 +79,8 @@ ComboBox {
         }
 
         background: Rectangle {
-            color: Style.backgroundColor
-            border.color: Style.menuBorder
+            color: palette.toolTipBase
+            border.color: palette.dark
             radius: Style.slightlyRoundedButtonRadius
         }
     }
@@ -92,13 +91,9 @@ ComboBox {
         width: clearComboBox.width
         contentItem: EnforcedPlainTextLabel {
             text: modelData.display
-            color: Style.ncTextColor
             elide: Text.ElideRight
             verticalAlignment: Text.AlignVCenter
         }
         highlighted: clearComboBox.highlightedIndex === index
-        background: Rectangle {
-           color: clearStatusDelegate.highlighted || clearStatusDelegate.hovered ? Style.lightHover : Style.backgroundColor
-       }
     }
 }

src/gui/EmojiPicker.qml

@@ -50,8 +50,12 @@ ColumnLayout {
             height: headerLayout.height
 
             background: Rectangle {
-                color: Style.lightHover
-                visible: ListView.isCurrentItem || headerDelegate.highlighted || headerDelegate.checked || headerDelegate.down || headerDelegate.hovered
+                color: palette.highlight
+                visible: ListView.isCurrentItem ||
+                         headerDelegate.highlighted ||
+                         headerDelegate.checked ||
+                         headerDelegate.down ||
+                         headerDelegate.hovered
                 radius: Style.slightlyRoundedButtonRadius
             }
 
@@ -59,7 +63,6 @@ ColumnLayout {
                 horizontalAlignment: Text.AlignHCenter
                 verticalAlignment: Text.AlignVCenter
                 text: emoji
-                color: Style.ncTextColor
             }
 
             Rectangle {
@@ -70,7 +73,7 @@ ColumnLayout {
 
                 visible: ListView.isCurrentItem
 
-                color: Style.menuBorder
+                color: palette.dark
             }
 
 
@@ -84,7 +87,7 @@ ColumnLayout {
     Rectangle {
         height: Style.normalBorderWidth
         Layout.fillWidth: true
-        color: Style.menuBorder
+        color: palette.dark
     }
 
     GridView {
@@ -109,7 +112,7 @@ ColumnLayout {
             height: metrics.height * 2
 
             background: Rectangle {
-                color: Style.lightHover
+                color: palette.highlight
                 visible: ListView.isCurrentItem || emojiDelegate.highlighted || emojiDelegate.checked || emojiDelegate.down || emojiDelegate.hovered
                 radius: Style.slightlyRoundedButtonRadius
             }
@@ -118,7 +121,6 @@ ColumnLayout {
                 horizontalAlignment: Text.AlignHCenter
                 verticalAlignment: Text.AlignVCenter
                 text: modelData === undefined ? "" : modelData.unicode
-                color: Style.ncTextColor
             }
 
             onClicked: {
@@ -132,7 +134,7 @@ ColumnLayout {
             width: parent.width * 0.8
             anchors.centerIn: parent
             text: qsTr("No recent emojis")
-            color: Style.ncSecondaryTextColor
+            color: palette.midlight
             wrapMode: Text.Wrap
             font.bold: true
             visible: emojiView.count === 0

src/gui/ErrorBox.qml

@@ -59,7 +59,6 @@ Item {
 
         EnforcedPlainTextLabel {
             Layout.fillWidth: true
-            color: Style.ncTextColor
             font.bold: true
             text: qsTr("Error")
             visible: errorBox.showCloseButton
@@ -70,7 +69,7 @@ Item {
             Layout.preferredHeight: Style.iconButtonWidth
 
             background: null
-            icon.color: Style.ncTextColor
+            icon.color: palette.buttonText
             icon.source: "qrc:///client/theme/close.svg"
 
             visible: errorBox.showCloseButton
@@ -86,7 +85,6 @@ Item {
             Layout.fillHeight: true
             Layout.columnSpan: 2
 
-            color: Style.ncTextColor
             wrapMode: Text.WordWrap
             text: errorBox.text
         }

src/gui/PredefinedStatusButton.qml

@@ -35,7 +35,7 @@ AbstractButton {
     property string clearAtText: ""
 
     background: Rectangle {
-        color: root.hovered || root.checked ? Style.lightHover : "transparent"
+        color: root.hovered || root.checked ? palette.highlight : "transparent"
         radius: Style.slightlyRoundedButtonRadius
     }
 
@@ -53,20 +53,17 @@ AbstractButton {
             spacing: Style.smallSpacing
             EnforcedPlainTextLabel {
                 text: root.statusText
-                color: Style.ncTextColor
                 verticalAlignment: Text.AlignVCenter
                 font.bold: true
             }
 
             EnforcedPlainTextLabel {
                 text: "-"
-                color: Style.ncTextColor
                 verticalAlignment: Text.AlignVCenter
             }
 
             EnforcedPlainTextLabel {
                 text: root.clearAtText
-                color: Style.ncTextColor
                 verticalAlignment: Text.AlignVCenter
             }
         }

src/gui/ResolveConflictsDialog.qml

@@ -22,7 +22,7 @@ import Style 1.0
 import com.nextcloud.desktopclient 1.0
 import "./tray"
 
-QtWindow.Window {
+ApplicationWindow {
     id: conflictsDialog
 
     required property var allConflicts
@@ -36,6 +36,26 @@ QtWindow.Window {
     minimumHeight: Style.minimumHeightResolveConflictsDialog
     title: qsTr('Solve sync conflicts')
 
+    // TODO: Rather than setting all these palette colours manually,
+    // create a custom style and do it for all components globally
+    palette {
+        text: Style.ncTextColor
+        windowText: Style.ncTextColor
+        buttonText: Style.ncTextColor
+        brightText: Style.ncTextBrightColor
+        highlight: Style.lightHover
+        highlightedText: Style.ncTextColor
+        light: Style.lightHover
+        midlight: Style.ncSecondaryTextColor
+        mid: Style.darkerHover
+        dark: Style.menuBorder
+        button: Style.buttonBackgroundColor
+        window: Style.backgroundColor
+        base: Style.backgroundColor
+        toolTipBase: Style.backgroundColor
+        toolTipText: Style.ncTextColor
+    }
+
     onClosing: function(close) {
         Systray.destroyDialog(self);
         close.accepted = true
@@ -110,7 +130,7 @@ QtWindow.Window {
             Layout.fillWidth: true
             Layout.leftMargin: 5
             Layout.rightMargin: 5
-            color: Style.menuBorder
+            color: palette.dark
             height: 1
         }
 
@@ -167,7 +187,7 @@ QtWindow.Window {
     }
 
     Rectangle {
-        color: Theme.systemPalette.window
+        color: Style.backgroundColor
         anchors.fill: parent
         z: 1
     }

src/gui/UserStatusSelector.qml

@@ -38,7 +38,6 @@ ColumnLayout {
             horizontalAlignment: Text.AlignHCenter
             font.bold: true
             text: qsTr("Online status")
-            color: Style.ncTextColor
         }
 
         GridLayout {
@@ -123,7 +122,6 @@ ColumnLayout {
             horizontalAlignment: Text.AlignHCenter
             font.bold: true
             text: qsTr("Status message")
-            color: Style.ncTextColor
         }
 
         RowLayout {
@@ -146,13 +144,13 @@ ColumnLayout {
                 padding: 0
                 z: hovered ? 2 : 0 // Make sure highlight is seen on top of text field
 
-                property color borderColor: showBorder ? Style.ncBlue : Style.menuBorder
+                property color borderColor: showBorder ? Style.ncBlue : palette.dark
 
                 // We create the square with only the top-left and bottom-left rounded corners
                 // by overlaying different rectangles on top of each other
                 background: Rectangle {
                     radius: Style.slightlyRoundedButtonRadius
-                    color: Style.buttonBackgroundColor
+                    color: palette.button
                     border.color: fieldButton.borderColor
                     border.width: Style.normalBorderWidth
 
@@ -161,7 +159,7 @@ ColumnLayout {
                         anchors.leftMargin: parent.width / 2
                         anchors.rightMargin: -1
                         z: 1
-                        color: Style.buttonBackgroundColor
+                        color: palette.button
                         border.color: fieldButton.borderColor
                         border.width: Style.normalBorderWidth
                     }
@@ -173,7 +171,7 @@ ColumnLayout {
                         anchors.topMargin: Style.normalBorderWidth
                         anchors.bottomMargin: Style.normalBorderWidth
                         z: 2
-                        color: Style.buttonBackgroundColor
+                        color: palette.button
                     }
                 }
             }
@@ -187,9 +185,9 @@ ColumnLayout {
                 anchors.centerIn: Overlay.overlay
 
                 background: Rectangle {
-                    color: Style.backgroundColor
+                    color: palette.toolTipBase
                     border.width: Style.normalBorderWidth
-                    border.color: Style.menuBorder
+                    border.color: palette.dark
                     radius: Style.slightlyRoundedButtonRadius
                 }
 
@@ -206,22 +204,21 @@ ColumnLayout {
             TextField {
                 id: userStatusMessageTextField
 
-                property color borderColor: activeFocus ? Style.ncBlue : Style.menuBorder
+                property color borderColor: activeFocus ? Style.ncBlue : palette.dark
 
                 Layout.fillWidth: true
                 Layout.preferredHeight: contentHeight + (Style.smallSpacing * 2)
 
                 placeholderText: qsTr("What is your status?")
-                placeholderTextColor: Style.ncSecondaryTextColor
+                placeholderTextColor: palette.midlight
                 text: userStatusSelectorModel.userStatusMessage
-                color: Style.ncTextColor
                 verticalAlignment: TextInput.AlignVCenter
                 selectByMouse: true
                 onEditingFinished: userStatusSelectorModel.userStatusMessage = text
 
                 background: Rectangle {
                     radius: Style.slightlyRoundedButtonRadius
-                    color: Style.backgroundColor
+                    color: palette.base
                     border.color: userStatusMessageTextField.borderColor
                     border.width: Style.normalBorderWidth
 
@@ -229,7 +226,7 @@ ColumnLayout {
                         anchors.fill: parent
                         anchors.rightMargin: parent.width / 2
                         z: 1
-                        color: Style.backgroundColor
+                        color: palette.base
                         border.color: userStatusMessageTextField.borderColor
                         border.width: Style.normalBorderWidth
                     }
@@ -241,7 +238,7 @@ ColumnLayout {
                         anchors.topMargin: Style.normalBorderWidth
                         anchors.bottomMargin: Style.normalBorderWidth
                         z: 2
-                        color: Style.backgroundColor
+                        color: palette.base
                     }
                 }
             }
@@ -285,7 +282,6 @@ ColumnLayout {
                 verticalAlignment: Text.AlignVCenter
 
                 text: qsTr("Clear status message after")
-                color: Style.ncTextColor
                 wrapMode: Text.Wrap
             }
 

src/gui/UserStatusSelectorButton.qml

@@ -34,7 +34,7 @@ AbstractButton {
 
     background: Rectangle {
         radius: root.primary ? Style.veryRoundedButtonRadius : Style.mediumRoundedButtonRadius
-        color: root.colored ? Style.ncBlue : Style.buttonBackgroundColor
+        color: root.colored ? Style.ncBlue : palette.button
         opacity: root.colored && root.hovered ? Style.hoverOpacity : 1.0
         border.color: Style.ncBlue
         border.width: root.showBorder ? root.primary ? Style.normalBorderWidth : Style.thickBorderWidth : 0
@@ -71,7 +71,7 @@ AbstractButton {
 
             text: root.text
             wrapMode: Text.Wrap
-            color: root.colored ? Style.ncHeaderTextColor : Style.ncTextColor
+            color: root.colored ? palette.brightText : palette.buttonText
             font.bold: root.primary
         }
 
@@ -85,7 +85,7 @@ AbstractButton {
 
             text: root.secondaryText
             wrapMode: Text.Wrap
-            color: Style.ncSecondaryTextColor
+            color: palette.midlight
             visible: root.secondaryText !== ""
         }
     }

src/gui/UserStatusSelectorPage.qml

@@ -32,7 +32,7 @@ Page {
     padding: Style.standardSpacing * 2
 
     background: Rectangle {
-        color: Style.backgroundColor
+        color: palette.window
         radius: Style.trayWindowRadius
     }
     

src/gui/filedetails/FileDetailsPage.qml

@@ -64,7 +64,7 @@ Page {
     bottomPadding: intendedPadding
 
     background: Rectangle {
-        color: Style.backgroundColor
+        color: palette.window
         visible: root.backgroundsVisible
     }
 
@@ -121,7 +121,6 @@ Page {
                 Layout.rightMargin: headerGridLayout.textRightMargin
 
                 text: root.fileDetails.name
-                color: Style.ncTextColor
                 font.bold: true
                 wrapMode: Text.Wrap
             }
@@ -134,8 +133,8 @@ Page {
                 Layout.preferredHeight: width
                 Layout.rightMargin: headerGridLayout.textRightMargin
 
-                icon.source: "image://svgimage-custom-color/clear.svg" + "/" + Style.ncTextColor
-                bgColor: Style.lightHover
+                icon.source: "image://svgimage-custom-color/clear.svg" + "/" + palette.buttonText
+                bgColor: palette.highlight
                 bgNormalOpacity: 0
                 toolTipText: qsTr("Dismiss")
 
@@ -151,7 +150,7 @@ Page {
                 Layout.rightMargin: headerGridLayout.textRightMargin
 
                 text: `${root.fileDetails.sizeString} · ${root.fileDetails.lastChangedString}`
-                color: Style.ncSecondaryTextColor
+                color: palette.midlight
                 wrapMode: Text.Wrap
             }
 
@@ -162,7 +161,7 @@ Page {
                 Layout.rightMargin: headerGridLayout.textRightMargin
 
                 text: root.fileDetails.lockExpireString
-                color: Style.ncSecondaryTextColor
+                color: palette.midlight
                 wrapMode: Text.Wrap
                 visible: headerGridLayout.showFileLockedString
             }
@@ -219,9 +218,6 @@ Page {
             Layout.rightMargin: root.intendedPadding
 
             padding: 0
-            background: Rectangle {
-                color: Style.backgroundColor
-            }
 
             NCTabButton {
                 svgCustomColorSource: "image://svgimage-custom-color/activity.svg"

src/gui/filedetails/FileDetailsView.qml

@@ -30,7 +30,7 @@ StackView {
     property bool backgroundsVisible: true
 
     background: Rectangle {
-        color: Style.backgroundColor
+        color: palette.window
         visible: root.backgroundsVisible
     }
 

src/gui/filedetails/FileDetailsWindow.qml

@@ -33,6 +33,26 @@ ApplicationWindow {
 
     title: qsTr("File details of %1 · %2").arg(fileDetailsPage.fileDetails.name).arg(Systray.windowTitle)
 
+    // TODO: Rather than setting all these palette colours manually,
+    // create a custom style and do it for all components globally
+    palette {
+        text: Style.ncTextColor
+        windowText: Style.ncTextColor
+        buttonText: Style.ncTextColor
+        brightText: Style.ncTextBrightColor
+        highlight: Style.lightHover
+        highlightedText: Style.ncTextColor
+        light: Style.lightHover
+        midlight: Style.ncSecondaryTextColor
+        mid: Style.darkerHover
+        dark: Style.menuBorder
+        button: Style.buttonBackgroundColor
+        window: Style.backgroundColor
+        base: Style.backgroundColor
+        toolTipBase: Style.backgroundColor
+        toolTipText: Style.ncTextColor
+    }
+
     FileDetailsView {
         id: fileDetailsPage
         anchors.fill: parent

src/gui/filedetails/FileTag.qml

@@ -21,13 +21,13 @@ EnforcedPlainTextLabel {
     id: internalLabel
 
     background: Rectangle {
-        border.color: Style.lightHover
+        border.color: palette.dark
         border.width: Style.normalBorderWidth
         radius: Style.veryRoundedButtonRadius
         color: "transparent"
     }
 
-    color: Style.ncSecondaryTextColor
+    color: palette.midlight
     elide: Text.ElideRight
     padding: Style.smallSpacing
 }

src/gui/filedetails/NCInputTextEdit.qml

@@ -22,12 +22,11 @@ import Style 1.0
 TextEdit {
     id: root
 
-    property color accentColor: Style.ncBlue
-    property color secondaryColor: Style.menuBorder
-    property alias submitButton: submitButton
+    readonly property color accentColor: Style.ncBlue
+    readonly property color secondaryColor: palette.dark
+    readonly property alias submitButton: submitButton
 
     clip: true
-    color: Style.ncTextColor
     textMargin: Style.smallSpacing
     wrapMode: TextEdit.Wrap
     selectByMouse: true
@@ -39,7 +38,7 @@ TextEdit {
         radius: Style.slightlyRoundedButtonRadius
         border.width: Style.normalBorderWidth
         border.color: root.activeFocus ? root.accentColor : root.secondaryColor
-        color: Style.backgroundColor
+        color: palette.base
         z: -1
     }
 

src/gui/filedetails/NCInputTextField.qml

@@ -22,13 +22,11 @@ import Style 1.0
 TextField {
     id: root
 
-    property color accentColor: Style.ncBlue
-    property color secondaryColor: Style.menuBorder
-    property alias submitButton: submitButton
+    readonly property color accentColor: Style.ncBlue
+    readonly property color secondaryColor: palette.dark
+    readonly property alias submitButton: submitButton
 
     implicitHeight: Style.talkReplyTextFieldPreferredHeight
-    color: Style.ncTextColor
-    placeholderTextColor: secondaryColor
 
     rightPadding: submitButton.width
 
@@ -39,7 +37,7 @@ TextField {
         radius: Style.slightlyRoundedButtonRadius
         border.width: Style.normalBorderWidth
         border.color: root.activeFocus ? root.accentColor : root.secondaryColor
-        color: Style.backgroundColor
+        color: palette.base
     }
 
     Button {

src/gui/filedetails/NCRadioButton.qml

@@ -18,10 +18,10 @@ import Style 1.0
 
 RadioButton {
     id: root
+
     property int indicatorItemWidth: Style.radioButtonIndicatorSize
     property int indicatorItemHeight: Style.radioButtonIndicatorSize
-    property string color: Style.ncTextColor
-    readonly property int radius: Style.radioButtonCustomRadius
+    property int radius: Style.radioButtonCustomRadius
 
     indicator: Rectangle {
         implicitWidth: root.indicatorItemWidth
@@ -30,12 +30,13 @@ RadioButton {
         anchors.left: parent.left
         anchors.leftMargin: Style.radioButtonCustomMarginLeftOuter
         radius: root.radius
-        border.color: root.color
+        border.color: palette.dark
         border.width: Style.normalBorderWidth
+
         Rectangle {
             anchors.fill: parent
             visible: root.checked
-            color: root.color
+            color: palette.buttonText
             radius: root.radius
             anchors.margins: Style.radioButtonCustomMarginLeftInner
         }

src/gui/filedetails/NCTabButton.qml

@@ -29,13 +29,13 @@ TabButton {
     padding: Style.smallSpacing
     background: Rectangle {
         radius: Style.slightlyRoundedButtonRadius
-        color: tabButton.pressed ? Style.lightHover : Style.backgroundColor
+        color: tabButton.pressed ? palette.highlight : palette.window
     }
 
     contentItem: ColumnLayout {
         id: tabButtonLayout
 
-        property var elementColors: tabButton.checked || tabButton.hovered ? Style.ncTextColor : Style.ncSecondaryTextColor
+        property var elementColors: tabButton.checked || tabButton.hovered ? palette.buttonText : palette.midlight
 
         // We'd like to just set the height of the Image, but this causes crashing.
         // So we use a wrapping Item and use anchors to adjust the size.
@@ -82,7 +82,7 @@ TabButton {
             implicitWidth: textWidth + Style.standardSpacing * 2
             implicitHeight: 2
 
-            color: tabButton.checked ? Style.ncBlue : tabButton.hovered ? Style.lightHover : "transparent"
+            color: tabButton.checked ? Style.ncBlue : tabButton.hovered ? palette.highlight : "transparent"
         }
     }
 }

src/gui/filedetails/ShareDelegate.qml

@@ -126,7 +126,6 @@ GridLayout {
         Layout.rowSpan: root.rows
 
         text: root.text
-        color: Style.ncTextColor
         elide: Text.ElideRight
     }
 
@@ -139,7 +138,7 @@ GridLayout {
         Layout.column: 1
 
         text: root.detailText
-        color: Style.ncSecondaryTextColor
+        color: palette.midlight
         elide: Text.ElideRight
         visible: text !== ""
     }
@@ -161,10 +160,12 @@ GridLayout {
 
             toolTipText: qsTr("Create a new share link")
 
-            bgColor: Style.lightHover
+            bgColor: palette.highlight
             bgNormalOpacity: 0
 
-            icon.source: "image://svgimage-custom-color/add.svg/" + Style.ncTextColor
+            icon.source: "image://svgimage-custom-color/add.svg/" + palette.buttonText
+            icon.width: Style.smallIconSize
+            icon.height: Style.smallIconSize
 
             visible: (root.isPlaceholderLinkShare || root.isSecureFileDropPlaceholderLinkShare) && root.canCreateLinkShares
             enabled: visible
@@ -194,15 +195,15 @@ GridLayout {
             toolTipText: qsTr("Copy share link location")
 
             text: shareLinkCopied ? qsTr("Copied!") : ""
-            textColor: Style.ncHeaderTextColor
+            textColor: palette.brightText
             contentsFont.bold: true
-            bgColor: shareLinkCopied ? Style.positiveColor : Style.lightHover
+            bgColor: shareLinkCopied ? Style.positiveColor : palette.highlight
             bgNormalOpacity: shareLinkCopied ? 1 : 0
 
-            icon.source: shareLinkCopied ? "image://svgimage-custom-color/copy.svg/" + Style.ncHeaderTextColor :
-                                           "image://svgimage-custom-color/copy.svg/" + Style.ncTextColor
-            icon.width: 16
-            icon.height: 16
+            icon.source: shareLinkCopied ? "image://svgimage-custom-color/copy.svg/" + palette.brightText :
+                                           "image://svgimage-custom-color/copy.svg/" + palette.buttonText
+            icon.width: Style.smallIconSize
+            icon.height: Style.smallIconSize
 
             visible: root.isLinkShare || root.isInternalLinkShare
             enabled: visible
@@ -242,10 +243,12 @@ GridLayout {
 
             toolTipText: qsTr("Share options")
 
-            bgColor: Style.lightHover
+            bgColor: palette.highlight
             bgNormalOpacity: 0
 
-            icon.source: "image://svgimage-custom-color/more.svg/" + Style.ncTextColor
+            icon.source: "image://svgimage-custom-color/more.svg/" + palette.buttonText
+            icon.width: Style.smallIconSize
+            icon.height: Style.smallIconSize
 
             visible: !root.isPlaceholderLinkShare && !root.isSecureFileDropPlaceholderLinkShare && !root.isInternalLinkShare
             enabled: visible

src/gui/filedetails/ShareDetailsPage.qml

@@ -160,23 +160,8 @@ Page {
 
     padding: Style.standardSpacing * 2
 
-    // TODO: Rather than setting all these palette colours manually,
-    // create a custom style and do it for all components globally
-    palette {
-        text: Style.ncTextColor
-        windowText: Style.ncTextColor
-        buttonText: Style.ncTextColor
-        light: Style.lightHover
-        midlight: Style.lightHover
-        mid: Style.ncSecondaryTextColor
-        dark: Style.menuBorder
-        button: Style.menuBorder
-        window: Style.backgroundColor
-        base: Style.backgroundColor
-    }
-
     background: Rectangle {
-        color: Style.backgroundColor
+        color: palette.window
         visible: root.backgroundsVisible
     }
 
@@ -217,7 +202,6 @@ Page {
                 Layout.fillWidth: true
 
                 text: qsTr("Edit share")
-                color: Style.ncTextColor
                 font.bold: true
                 elide: Text.ElideRight
             }
@@ -230,8 +214,8 @@ Page {
                 Layout.preferredHeight: width
                 Layout.rightMargin: root.padding
 
-                icon.source: "image://svgimage-custom-color/clear.svg" + "/" + Style.ncTextColor
-                bgColor: Style.lightHover
+                icon.source: "image://svgimage-custom-color/clear.svg" + "/" + palette.buttonText
+                bgColor: palette.highlight
                 bgNormalOpacity: 0
                 toolTipText: qsTr("Dismiss")
 
@@ -245,7 +229,7 @@ Page {
                 Layout.rightMargin: root.padding
 
                 text: root.fileDetails.name
-                color: Style.ncSecondaryTextColor
+                color: palette.midlight
                 wrapMode: Text.Wrap
             }
         }
@@ -258,10 +242,10 @@ Page {
         ColumnLayout {
             id: moreMenu
 
-            property int rowIconWidth: 16
-            property int indicatorItemWidth: 20
-            property int indicatorSpacing: Style.standardSpacing
-            property int itemPadding: Style.smallSpacing
+            readonly property int rowIconWidth: Style.smallIconSize
+            readonly property int indicatorItemWidth: 20
+            readonly property int indicatorSpacing: Style.standardSpacing
+            readonly property int itemPadding: Style.smallSpacing
 
             width: parent.width
 
@@ -280,7 +264,7 @@ Page {
                     horizontalAlignment: Image.AlignHCenter
                     fillMode: Image.Pad
 
-                    source: "image://svgimage-custom-color/edit.svg/" + Style.menuBorder
+                    source: "image://svgimage-custom-color/edit.svg/" + palette.dark
                     sourceSize.width: moreMenu.rowIconWidth
                     sourceSize.height: moreMenu.rowIconWidth
                 }
@@ -316,6 +300,9 @@ Page {
                 active: !root.isFolderItem && !root.isEncryptedItem
                 visible: active
                 sourceComponent: CheckBox {
+                    // TODO: Rather than setting all these palette colours manually,
+                    // create a custom style and do it for all components globally
+                    palette.window: palette.dark // NOTE: Fusion theme uses darker window colour for the border of the checkbox
                     spacing: moreMenu.indicatorSpacing
                     padding: moreMenu.itemPadding
                     indicator.width: moreMenu.indicatorItemWidth
@@ -413,6 +400,10 @@ Page {
                         anchors.left: parent.left
                         anchors.right: parent.right
 
+                        // TODO: Rather than setting all these palette colours manually,
+                        // create a custom style and do it for all components globally
+                        palette.window: palette.dark // NOTE: Fusion theme uses darker window colour for the border of the checkbox
+
                         spacing: moreMenu.indicatorSpacing
                         padding: moreMenu.itemPadding
                         indicator.width: moreMenu.indicatorItemWidth
@@ -437,6 +428,10 @@ Page {
 
                 Layout.fillWidth: true
 
+                // TODO: Rather than setting all these palette colours manually,
+                // create a custom style and do it for all components globally
+                palette.window: palette.dark // NOTE: Fusion theme uses darker window colour for the border of the checkbox
+
                 spacing: moreMenu.indicatorSpacing
                 padding: moreMenu.itemPadding
                 indicator.width: moreMenu.indicatorItemWidth
@@ -476,7 +471,7 @@ Page {
                     horizontalAlignment: Image.AlignHCenter
                     fillMode: Image.Pad
 
-                    source: "image://svgimage-custom-color/lock-https.svg/" + Style.menuBorder
+                    source: "image://svgimage-custom-color/lock-https.svg/" + palette.dark
                     sourceSize.width: moreMenu.rowIconWidth
                     sourceSize.height: moreMenu.rowIconWidth
                 }
@@ -542,6 +537,10 @@ Page {
 
                 Layout.fillWidth: true
 
+                // TODO: Rather than setting all these palette colours manually,
+                // create a custom style and do it for all components globally
+                palette.window: palette.dark // NOTE: Fusion theme uses darker window colour for the border of the checkbox
+
                 spacing: moreMenu.indicatorSpacing
                 padding: moreMenu.itemPadding
                 indicator.width: moreMenu.indicatorItemWidth
@@ -580,7 +579,7 @@ Page {
                     horizontalAlignment: Image.AlignHCenter
                     fillMode: Image.Pad
 
-                    source: "image://svgimage-custom-color/calendar.svg/" + Style.menuBorder
+                    source: "image://svgimage-custom-color/calendar.svg/" + palette.dark
                     sourceSize.width: moreMenu.rowIconWidth
                     sourceSize.height: moreMenu.rowIconWidth
                 }
@@ -733,6 +732,10 @@ Page {
 
                 Layout.fillWidth: true
 
+                // TODO: Rather than setting all these palette colours manually,
+                // create a custom style and do it for all components globally
+                palette.window: palette.dark // NOTE: Fusion theme uses darker window colour for the border of the checkbox
+
                 spacing: moreMenu.indicatorSpacing
                 padding: moreMenu.itemPadding
                 indicator.width: moreMenu.indicatorItemWidth
@@ -771,7 +774,7 @@ Page {
                     horizontalAlignment: Image.AlignHCenter
                     fillMode: Image.Pad
 
-                    source: "image://svgimage-custom-color/edit.svg/" + Style.menuBorder
+                    source: "image://svgimage-custom-color/edit.svg/" + palette.dark
                     sourceSize.width: moreMenu.rowIconWidth
                     sourceSize.height: moreMenu.rowIconWidth
                 }
@@ -807,12 +810,12 @@ Page {
                 height: Style.standardPrimaryButtonHeight
 
                 icon.source: "image://svgimage-custom-color/close.svg/" + Style.errorBoxBackgroundColor
-                imageSourceHover: "image://svgimage-custom-color/close.svg/" + Style.ncHeaderTextColor
+                imageSourceHover: "image://svgimage-custom-color/close.svg/" + palette.brightText
                 text: qsTr("Unshare")
                 textColor: Style.errorBoxBackgroundColor
                 textColorHovered: "white"
                 contentsFont.bold: true
-                bgNormalColor: Style.buttonBackgroundColor
+                bgNormalColor: palette.button
                 bgHoverColor: Style.errorBoxBackgroundColor
                 bgNormalOpacity: 1.0
                 bgHoverOpacity: 1.0
@@ -824,12 +827,12 @@ Page {
                 height: Style.standardPrimaryButtonHeight
 
                 icon.source: "image://svgimage-custom-color/add.svg/" + Style.ncBlue
-                imageSourceHover: "image://svgimage-custom-color/add.svg/" + Style.ncHeaderTextColor
+                imageSourceHover: "image://svgimage-custom-color/add.svg/" + palette.brightText
                 text: qsTr("Add another link")
                 textColor: Style.ncBlue
-                textColorHovered: Style.ncHeaderTextColor
+                textColorHovered: palette.brightText
                 contentsFont.bold: true
-                bgNormalColor: Style.buttonBackgroundColor
+                bgNormalColor: palette.button
                 bgHoverColor: Style.ncBlue
                 bgNormalOpacity: 1.0
                 bgHoverOpacity: 1.0
@@ -848,6 +851,7 @@ Page {
         rightPadding: root.padding
         leftPadding: root.padding
         alignment: Qt.AlignRight | Qt.AlignVCenter
+        contentWidth: (contentItem as ListView).contentWidth
         visible: copyShareLinkButton.visible
 
         CustomButton {
@@ -867,9 +871,9 @@ Page {
 
             height: Style.standardPrimaryButtonHeight
 
-            icon.source: "image://svgimage-custom-color/copy.svg/" + Style.ncHeaderTextColor
+            icon.source: "image://svgimage-custom-color/copy.svg/" + palette.brightText
             text: shareLinkCopied ? qsTr("Share link copied!") : qsTr("Copy share link")
-            textColor: Style.ncHeaderTextColor
+            textColor: palette.brightText
             contentsFont.bold: true
             bgColor: shareLinkCopied ? Style.positiveColor : Style.ncBlue
             bgNormalOpacity: 1.0
@@ -888,6 +892,10 @@ Page {
                 NumberAnimation { duration: Style.shortAnimationDuration }
             }
 
+            Behavior on Layout.preferredWidth {
+                SmoothedAnimation { duration: Style.shortAnimationDuration }
+            }
+
             TextEdit {
                 id: clipboardHelper
                 visible: false

src/gui/filedetails/ShareView.qml

@@ -93,21 +93,6 @@ ColumnLayout {
         modal: true
         closePolicy: Popup.NoAutoClose
 
-        // TODO: Rather than setting all these palette colours manually,
-        // create a custom style and do it for all components globally
-        palette {
-            text: Style.ncTextColor
-            windowText: Style.ncTextColor
-            buttonText: Style.ncTextColor
-            light: Style.lightHover
-            midlight: Style.lightHover
-            mid: Style.ncSecondaryTextColor
-            dark: Style.menuBorder
-            button: Style.menuBorder
-            window: Style.backgroundColor
-            base: Style.backgroundColor
-        }
-
         visible: false
 
         onAccepted: {
@@ -260,12 +245,12 @@ ColumnLayout {
                     z: Infinity
 
                     sourceComponent: Rectangle {
-                        color: Style.backgroundColor
+                        color: palette.window
                         opacity: 0.5
 
                         NCBusyIndicator {
                             anchors.centerIn: parent
-                            color: Style.ncSecondaryTextColor
+                            color: palette.midlight
                         }
                     }
                 }
@@ -292,7 +277,7 @@ ColumnLayout {
                 id: sharingDisabledLabel
                 width: parent.width
                 text: qsTr("Sharing is disabled")
-                color: Style.ncSecondaryTextColor
+                color: palette.midlight
                 wrapMode: Text.Wrap
                 horizontalAlignment: Text.AlignHCenter
                 verticalAlignment: Text.AlignVCenter
@@ -300,7 +285,7 @@ ColumnLayout {
             EnforcedPlainTextLabel {
                 width: parent.width
                 text: qsTr("This item cannot be shared.")
-                color: Style.ncSecondaryTextColor
+                color: palette.midlight
                 wrapMode: Text.Wrap
                 horizontalAlignment: Text.AlignHCenter
                 verticalAlignment: Text.AlignVCenter
@@ -309,7 +294,7 @@ ColumnLayout {
             EnforcedPlainTextLabel {
                 width: parent.width
                 text: qsTr("Sharing is disabled.")
-                color: Style.ncSecondaryTextColor
+                color: palette.midlight
                 wrapMode: Text.Wrap
                 horizontalAlignment: Text.AlignHCenter
                 verticalAlignment: Text.AlignVCenter

src/gui/filedetails/ShareeDelegate.qml

@@ -67,7 +67,6 @@ ItemDelegate {
             horizontalAlignment: Text.AlignLeft
             verticalAlignment: Text.AlignVCenter
             text: model.display
-            color: Style.ncTextColor
         }
     }
 }

src/gui/filedetails/ShareeSearchField.qml

@@ -37,7 +37,7 @@ TextField {
     }
 
     readonly property int horizontalPaddingOffset: Style.trayHorizontalMargin
-    readonly property color placeholderColor: Style.menuBorder
+    readonly property color placeholderColor: palette.dark
     readonly property double iconsScaleFactor: 0.6
 
     function triggerSuggestionsVisibility() {
@@ -46,7 +46,6 @@ TextField {
 
     placeholderText: qsTr("Search for users or groups…")
     placeholderTextColor: placeholderColor
-    color: Style.ncTextColor
     enabled: !shareeModel.fetchOngoing
 
     onActiveFocusChanged: triggerSuggestionsVisibility()
@@ -93,9 +92,9 @@ TextField {
 
     background: Rectangle {
         radius: 5
-        border.color: parent.activeFocus ? UserModel.currentUser.accentColor : Style.menuBorder
+        border.color: parent.activeFocus ? UserModel.currentUser.accentColor : palette.dark
         border.width: 1
-        color: Style.backgroundColor
+        color: palette.base
     }
 
     Image {
@@ -172,21 +171,6 @@ TextField {
         height: 100
         y: root.height
 
-        // TODO: Rather than setting all these palette colours manually,
-        // create a custom style and do it for all components globally
-        palette {
-            text: Style.ncTextColor
-            windowText: Style.ncTextColor
-            buttonText: Style.ncTextColor
-            light: Style.lightHover
-            midlight: Style.lightHover
-            mid: Style.ncSecondaryTextColor
-            dark: Style.menuBorder
-            button: Style.menuBorder
-            window: Style.backgroundColor
-            base: Style.backgroundColor
-        }
-
         contentItem: ScrollView {
             id: suggestionsScrollView
 
@@ -203,7 +187,7 @@ TextField {
                 highlight: Rectangle {
                     width: shareeListView.currentItem.width
                     height: shareeListView.currentItem.height
-                    color: Style.lightHover
+                    color: palette.highlight
                 }
                 highlightFollowsCurrentItem: true
                 highlightMoveDuration: 0

src/gui/tray/ActivityActionButton.qml

@@ -12,9 +12,9 @@ AbstractButton {
 
     property string imageSourceHover: ""
 
-    property color adjustedHeaderColor: Style.adjustedCurrentUserHeaderColor
-    property color textColor: primaryButton ? adjustedHeaderColor : Style.ncTextColor
-    property color textColorHovered: primaryButton ? Style.currentUserHeaderTextColor : Style.ncTextColor
+    readonly property color adjustedHeaderColor: Style.adjustedCurrentUserHeaderColor
+    readonly property color textColor: primaryButton ? adjustedHeaderColor : palette.buttonText
+    readonly property color textColorHovered: primaryButton ? Style.currentUserHeaderTextColor : palette.buttonText
 
     property string verb: ""
     property bool isTalkReplyButton: false
@@ -39,14 +39,7 @@ AbstractButton {
         text: root.toolTipText
         delay: Qt.styleHints.mousePressAndHoldInterval
         visible: root.toolTipText !== "" && root.hovered
-        contentItem: EnforcedPlainTextLabel {
-            text: customTextButtonTooltip.text
-            color: Style.ncTextColor
-        }
-        background: Rectangle {
-            border.color: Style.menuBorder
-            color: Style.backgroundColor
-        }
+        contentItem: EnforcedPlainTextLabel { text: customTextButtonTooltip.text }
     }
 
     Component {

src/gui/tray/ActivityItem.qml

@@ -30,7 +30,7 @@ ItemDelegate {
     }
 
     contentItem: ColumnLayout {
-        spacing: Style.activityContentSpace
+        spacing: Style.smallSpacing
 
         ActivityItemContent {
             id: activityContent

src/gui/tray/ActivityItemContent.qml

@@ -13,8 +13,6 @@ RowLayout {
 
     property variant activity: {{}}
 
-    property color activityTextTitleColor: Style.ncTextColor
-
     property bool showDismissButton: false
 
     property bool childHovered: fileDetailsButton.hovered || dismissActionButton.hovered
@@ -32,8 +30,6 @@ RowLayout {
         readonly property int imageHeight: height * (1 - Style.thumbnailImageSizeReduction)
         readonly property int thumbnailRadius: model.thumbnail && model.thumbnail.isUserAvatar ? width / 2 : 3
 
-        Layout.fillHeight: true
-
         implicitWidth: root.iconSize
         implicitHeight: model.thumbnail && model.thumbnail.isMimeTypeIcon ? root.iconSize * 0.9 : root.iconSize
 
@@ -127,31 +123,21 @@ RowLayout {
 
         RowLayout {
             Layout.fillWidth: true
-            Layout.maximumWidth: activityContentLayout.width
 
             spacing: Style.trayHorizontalMargin
 
             EnforcedPlainTextLabel {
                 id: activityTextTitle
                 text: (root.activityData.type === "Activity" || root.activityData.type === "Notification") ? root.activityData.subject : root.activityData.message
-                height: (text === "") ? 0 : implicitHeight
 
-                Layout.maximumWidth: activityContentLayout.width - Style.trayHorizontalMargin -
-                                     (activityTextDateTime.visible ? activityTextDateTime.width + Style.trayHorizontalMargin : 0) -
-                                     (dismissActionButton.visible ? dismissActionButton.width + Style.trayHorizontalMargin : 0)
-                Layout.alignment: Qt.AlignTop | Qt.AlignLeft
+                Layout.fillWidth: true
+                Layout.alignment: Qt.AlignVCenter | Qt.AlignLeft
 
                 elide: Text.ElideRight
                 wrapMode: Text.Wrap
-                maximumLineCount: 1
+                maximumLineCount: 2
                 font.pixelSize: Style.topLinePixelSize
-                color: Style.ncTextColor
                 visible: text !== ""
-
-                NCToolTip {
-                    text: parent.text
-                    visible: parent.hovered
-                }
             }
 
             Item {
@@ -164,18 +150,39 @@ RowLayout {
 
                 Layout.alignment: Qt.AlignVCenter | Qt.AlignRight
                 height: (text === "") ? 0 : implicitHeight
-                width: parent.width
 
                 text: root.activityData.dateTime
-                elide: Text.ElideRight
-                wrapMode: Text.Wrap
-                maximumLineCount: 2
                 font.pixelSize: Style.subLinePixelSize
-                color: Style.ncSecondaryTextColor
+                color: palette.midlight
                 visible: text !== ""
             }
 
-            RoundButton {
+            CustomButton {
+                id: fileDetailsButton
+
+                Layout.preferredWidth: Style.dismissButtonSize
+                Layout.preferredHeight: Style.dismissButtonSize
+                Layout.alignment: Qt.AlignTop | Qt.AlignRight
+
+                icon.source: "image://svgimage-custom-color/more.svg/" + palette.buttonText
+
+                NCToolTip {
+                    text: qsTr("Open file details")
+                    visible: parent.hovered
+                }
+
+                display: Button.IconOnly
+                leftPadding: 0
+                rightPadding: 0
+                bgColor: palette.mid
+                bgNormalOpacity:  0
+
+                visible: model.showFileDetails
+
+                onClicked: Systray.presentShareViewInTray(model.openablePath)
+            }
+
+            CustomButton {
                 id: dismissActionButton
 
                 Layout.preferredWidth: Style.dismissButtonSize
@@ -184,12 +191,13 @@ RowLayout {
 
                 visible: root.showDismissButton && !fileDetailsButton.visible
 
-                icon.source: "image://svgimage-custom-color/clear.svg" + "/" + Style.ncTextColor
+                icon.source: "image://svgimage-custom-color/clear.svg/" + palette.buttonText
 
-                flat: true
                 display: Button.IconOnly
-                hoverEnabled: true
-                padding: 0
+                leftPadding: 0
+                rightPadding: 0
+                bgColor: palette.mid
+                bgNormalOpacity: 0
 
                 NCToolTip {
                     text: qsTr("Dismiss")
@@ -203,9 +211,8 @@ RowLayout {
         RowLayout {
             Layout.fillWidth: true
             Layout.fillHeight: true
-            Layout.minimumHeight: Style.minimumActivityItemHeight
-            Layout.maximumWidth: root.width - thumbnailItem.width
             spacing: Style.trayHorizontalMargin
+            visible: activityTextInfo.visible || talkReplyMessageSent.visible || activityActions.visible
 
             EnforcedPlainTextLabel {
                 id: activityTextInfo
@@ -223,7 +230,6 @@ RowLayout {
                 wrapMode: Text.Wrap
                 maximumLineCount: 2
                 font.pixelSize: Style.subLinePixelSize
-                color: Style.ncTextColor
                 visible: text !== ""
             }
 
@@ -231,30 +237,6 @@ RowLayout {
                 Layout.fillWidth: true
             }
 
-            Button {
-                id: fileDetailsButton
-
-                Layout.preferredWidth: Style.headerButtonIconSize
-                Layout.preferredHeight: Style.headerButtonIconSize
-                Layout.alignment: Qt.AlignTop | Qt.AlignRight
-
-                icon.source: "image://svgimage-custom-color/more.svg"
-
-                NCToolTip {
-                    text: qsTr("Open file details")
-                    visible: parent.hovered
-                }
-
-                flat: true
-                display: Button.IconOnly
-                hoverEnabled: true
-                padding: 0
-
-                visible: model.showFileDetails
-
-                onClicked: Systray.presentShareViewInTray(model.openablePath)
-            }
-
             EnforcedPlainTextLabel {
                 id: talkReplyMessageSent
 
@@ -267,7 +249,7 @@ RowLayout {
                 wrapMode: Text.Wrap
                 maximumLineCount: 2
                 font.pixelSize: Style.topLinePixelSize
-                color: Style.ncSecondaryTextColor
+                color: palette.midlight
                 visible: text !== ""
             }
 

src/gui/tray/ActivityItemContextMenu.qml

@@ -20,7 +20,6 @@ AutoSizingMenu {
         delegate: MenuItem {
             id: moreActionsButtonContextMenuEntry
             text: model.modelData.label
-            palette.windowText: Style.ncTextColor
             onTriggered: menuEntryTriggered(model.modelData.actionIndex)
         }
     }

src/gui/tray/ActivityList.qml

@@ -30,6 +30,7 @@ ScrollView {
         Accessible.role: Accessible.List
         Accessible.name: qsTr("Activity list")
 
+        keyNavigationEnabled: true
         clip: true
         spacing: 0
         currentIndex: -1
@@ -37,14 +38,12 @@ ScrollView {
 
         highlight: Rectangle {
             id: activityHover
-
             anchors.fill: activityList.currentItem
-
-            color: Style.lightHover
-            visible: activityList.activeFocus
-
+            color: palette.highlight
             radius: Style.mediumRoundedButtonRadius
+            visible: activityList.activeFocus
         }
+
         highlightFollowsCurrentItem: true
         highlightMoveDuration: 0
         highlightResizeDuration: 0
@@ -57,6 +56,7 @@ ScrollView {
         }
 
         delegate: ActivityItem {
+            background: null
             width: activityList.contentItem.width
 
             isFileActivityList: controlRoot.isFileActivityList
@@ -100,13 +100,13 @@ ScrollView {
                 verticalAlignment: Image.AlignVCenter
                 horizontalAlignment: Image.AlignHCenter
                 fillMode: Image.PreserveAspectFit
-                source: "image://svgimage-custom-color/activity.svg/" + Style.ncSecondaryTextColor
+                source: "image://svgimage-custom-color/activity.svg/" + palette.midlight
             }
 
             EnforcedPlainTextLabel {
                width: parent.width
                text: qsTr("No activities yet")
-               color: Style.ncSecondaryTextColor
+               color: palette.midlight
                font.bold: true
                wrapMode: Text.Wrap
                horizontalAlignment: Text.AlignHCenter

src/gui/tray/AutoSizingMenu.qml

@@ -3,11 +3,6 @@ import QtQuick.Controls 2.3
 import Style 1.0
 
 Menu {
-    background: Rectangle {
-        border.color: Style.menuBorder
-        color: Style.backgroundColor
-    }
-
     width: {
         var result = 0;
         var padding = 0;

src/gui/tray/CallNotificationDialog.qml

@@ -22,7 +22,7 @@ import QtMultimedia 5.15
 import QtQuick.Controls 2.15
 import QtGraphicalEffects 1.15
 
-Window {
+ApplicationWindow {
     id: root
     color: "transparent"
     flags: Qt.Dialog | Qt.FramelessWindowHint | Qt.WindowStaysOnTopHint
@@ -55,6 +55,26 @@ Window {
     width: root.windowWidth
     height: rootBackground.height
 
+    // TODO: Rather than setting all these palette colours manually,
+    // create a custom style and do it for all components globally
+    palette {
+        text: Style.ncTextColor
+        windowText: Style.ncTextColor
+        buttonText: Style.ncTextColor
+        brightText: Style.ncTextBrightColor
+        highlight: Style.lightHover
+        highlightedText: Style.ncTextColor
+        light: Style.lightHover
+        midlight: Style.ncSecondaryTextColor
+        mid: Style.darkerHover
+        dark: Style.menuBorder
+        button: Style.buttonBackgroundColor
+        window: Style.backgroundColor
+        base: Style.backgroundColor
+        toolTipBase: Style.backgroundColor
+        toolTipText: Style.ncTextColor
+    }
+
     Component.onCompleted: {
         Systray.forceWindowInit(root);
         Systray.positionNotificationWindow(root);
@@ -89,7 +109,7 @@ Window {
         radius: Systray.useNormalWindow ? 0.0 : Style.trayWindowRadius
         color: Style.backgroundColor
         border.width: Style.trayWindowBorderWidth
-        border.color: Style.menuBorder
+        border.color: palette.dark
         clip: true
 
         Loader {
@@ -164,7 +184,7 @@ Window {
                     cache: true
 
                     source: root.usingUserAvatar ? root.talkNotificationData.userAvatar :
-                                                   Theme.darkMode ? root.talkIcon + Style.ncTextColor : root.talkIcon + Style.ncBlue
+                                                   Theme.darkMode ? root.talkIcon + palette.windowText : root.talkIcon + Style.ncBlue
                     sourceSize.width: Style.accountAvatarSize
                     sourceSize.height: Style.accountAvatarSize
 
@@ -195,7 +215,7 @@ Window {
             EnforcedPlainTextLabel {
                 id: message
                 text: root.subject
-                color: root.usingUserAvatar ? "white" : Style.ncTextColor
+                color: root.usingUserAvatar ? palette.brightText : palette.windowText
                 font.pixelSize: Style.topLinePixelSize
                 wrapMode: Text.WordWrap
                 horizontalAlignment: Text.AlignHCenter
@@ -223,10 +243,10 @@ Window {
                         bgColor: Style.ncBlue
                         bgNormalOpacity: 0.8
 
-                        textColor: Style.ncHeaderTextColor
+                        textColor: palette.brightText
 
-                        icon.source: root.talkIcon + Style.ncHeaderTextColor
-                        imageSourceHover: root.talkIcon + Style.ncHeaderTextColor
+                        icon.source: root.talkIcon + palette.brightText
+                        imageSourceHover: root.talkIcon + palette.brightText
 
                         Layout.fillWidth: true
                         Layout.preferredHeight: Style.callNotificationPrimaryButtonMinHeight
@@ -250,7 +270,7 @@ Window {
                     bgColor: Style.errorBoxBackgroundColor
                     bgNormalOpacity: 0.8
 
-                    textColor: Style.ncHeaderTextColor
+                    textColor: palette.brightText
 
                     icon.source: root.deleteIcon + "white"
                     imageSourceHover: root.deleteIcon + "white"

src/gui/tray/CustomButton.qml

@@ -25,7 +25,7 @@ Button {
 
     property string toolTipText: ""
 
-    property color textColor: Style.ncTextColor
+    property color textColor: palette.buttonText
     property color textColorHovered: textColor
 
     property alias contentsFont: contents.font
@@ -45,6 +45,8 @@ Button {
     rightPadding: root.text === "" ? Style.smallSpacing : Style.standardSpacing
     implicitWidth: contentItem.implicitWidth + leftPadding + rightPadding
 
+    hoverEnabled: true
+
     NCToolTip {
         text: root.toolTipText
         visible: root.toolTipText !== "" && root.hovered
@@ -56,6 +58,8 @@ Button {
         hovered: root.hovered
         imageSourceHover: root.imageSourceHover
         imageSource: root.icon.source
+        imageSourceWidth: root.icon.width
+        imageSourceHeight: root.icon.height
         text: root.text
         textColor: root.textColor
         textColorHovered: root.textColorHovered

src/gui/tray/EditFileLocallyLoadingDialog.qml

@@ -5,7 +5,7 @@ import com.nextcloud.desktopclient 1.0
 import QtQuick.Layouts 1.15
 import QtQuick.Controls 2.15
 
-Window {
+ApplicationWindow {
     id: root
     flags: Qt.Dialog | Qt.FramelessWindowHint | Qt.WindowStaysOnTopHint
 
@@ -19,6 +19,26 @@ Window {
     readonly property real fontPixelSize: Style.topLinePixelSize * 1.5
     readonly property real iconWidth: fontPixelSize * 2
 
+    // TODO: Rather than setting all these palette colours manually,
+    // create a custom style and do it for all components globally
+    palette {
+        text: Style.ncTextColor
+        windowText: Style.ncTextColor
+        buttonText: Style.ncTextColor
+        brightText: Style.ncTextBrightColor
+        highlight: Style.lightHover
+        highlightedText: Style.ncTextColor
+        light: Style.lightHover
+        midlight: Style.ncSecondaryTextColor
+        mid: Style.darkerHover
+        dark: Style.menuBorder
+        button: Style.buttonBackgroundColor
+        window: Style.backgroundColor
+        base: Style.backgroundColor
+        toolTipBase: Style.backgroundColor
+        toolTipText: Style.ncTextColor
+    }
+
     Component.onCompleted: {
         Systray.forceWindowInit(root);
         x = Screen.width / 2 - width / 2
@@ -32,7 +52,7 @@ Window {
         id: windowBackground
         color: Style.backgroundColor
         radius: Style.trayWindowRadius
-        border.color: Style.ncTextColor
+        border.color: palette.dark
         anchors.fill: parent
     }
 
@@ -43,6 +63,7 @@ Window {
         anchors.leftMargin: Style.standardSpacing
         anchors.rightMargin: Style.standardSpacing
         spacing: Style.standardSpacing
+
         NCBusyIndicator {
             id: busyIndicator
             Layout.topMargin: Style.standardSpacing
@@ -52,7 +73,7 @@ Window {
             imageSourceSizeHeight: root.iconWidth
             imageSourceSizeWidth: root.iconWidth
             padding: 0
-            color: Style.ncTextColor
+            color: palette.windowText
             running: true
         }
         EnforcedPlainTextLabel {
@@ -63,7 +84,6 @@ Window {
             elide: Text.ElideMiddle
             font.bold: true
             font.pixelSize: root.fontPixelSize
-            color: Style.ncTextColor
             horizontalAlignment: Text.AlignHCenter
             visible: root.fileName !== ""
         }
@@ -75,7 +95,6 @@ Window {
             text: qsTr("Opening file for local editing")
             elide: Text.ElideRight
             font.pixelSize: root.fontPixelSize
-            color: Style.ncTextColor
             horizontalAlignment: Text.AlignHCenter
         }
     }

src/gui/tray/HeaderButton.qml

@@ -33,7 +33,7 @@ Button {
 
     icon.width: Style.headerButtonIconSize
     icon.height: Style.headerButtonIconSize
-    icon.color: Style.ncHeaderTextColor
+    icon.color: palette.brightText
 
     Layout.alignment: Qt.AlignRight
     Layout.preferredWidth:  Style.trayWindowHeaderHeight

src/gui/tray/ListItemLineAndSubline.qml

@@ -29,8 +29,8 @@ ColumnLayout {
     property int titleFontSize: Style.unifiedSearchResultTitleFontSize
     property int sublineFontSize: Style.unifiedSearchResultSublineFontSize
 
-    property color titleColor: Style.ncTextColor
-    property color sublineColor: Style.ncSecondaryTextColor
+    property color titleColor: palette.windowText
+    property color sublineColor: palette.midlight
 
     EnforcedPlainTextLabel {
         id: title

src/gui/tray/NCBusyIndicator.qml

@@ -19,7 +19,7 @@ import Style 1.0
 BusyIndicator {
     id: root
 
-    property color color: Style.ncSecondaryTextColor
+    property color color: palette.midlight
     property string imageSource: "image://svgimage-custom-color/change.svg/"
 
     property int imageSourceSizeWidth: 64

src/gui/tray/NCButtonBackground.qml

@@ -20,8 +20,8 @@ Rectangle {
     property bool hovered: false
     property real normalOpacity: 0.3
     property real hoverOpacity: 1.0
-    property color normalColor: Style.buttonBackgroundColor
-    property color hoverColor: Style.buttonBackgroundColor
+    property color normalColor: palette.button
+    property color hoverColor: palette.button
 
     color: hovered ? hoverColor : normalColor
     opacity: hovered ? hoverOpacity : normalOpacity

src/gui/tray/NCButtonContents.qml

@@ -24,19 +24,29 @@ RowLayout {
     property bool hovered: false
     property string imageSourceHover: ""
     property string imageSource: ""
+    property int imageSourceWidth: undefined
+    property int imageSourceHeight: undefined
     property string text: ""
     property var display
 
-    property color textColor: Style.ncTextColor
+    property color textColor: palette.buttonText
     property color textColorHovered: textColor
     property alias font: buttonLabel.font
 
     Image {
         id: icon
 
-        Layout.fillWidth: !buttonLabel.visible
+        Layout.maximumWidth: root.height
+        Layout.maximumHeight: root.height
+        Layout.alignment: Qt.AlignCenter
 
         source: root.hovered ? root.imageSourceHover : root.imageSource
+
+        sourceSize {
+            width: root.imageSourceWidth
+            height: root.imageSourceHeight
+        }
+
         fillMode: Image.PreserveAspectFit
         horizontalAlignment: Image.AlignHCenter
         verticalAlignment: Image.AlignVCenter

src/gui/tray/NCToolTip.qml

@@ -24,11 +24,7 @@ ToolTip {
     delay: Qt.styleHints.mousePressAndHoldInterval
     contentItem: EnforcedPlainTextLabel {
         text: toolTip.text
-        color: Style.ncTextColor
         wrapMode: Text.Wrap
-    }
-    background: Rectangle {
-        border.color: Style.menuBorder
-        color: Style.backgroundColor
+        color: palette.toolTipText
     }
 }

src/gui/tray/SyncStatus.qml

@@ -56,7 +56,6 @@ RowLayout {
             verticalAlignment: Text.AlignVCenter
             font.pixelSize: Style.topLinePixelSize
             font.bold: true
-            color: Style.ncTextColor
             wrapMode: Text.Wrap
         }
 
@@ -71,19 +70,7 @@ RowLayout {
 
                 // TODO: Rather than setting all these palette colours manually,
                 // create a custom style and do it for all components globally
-                palette {
-                    text: Style.ncTextColor
-                    windowText: Style.ncTextColor
-                    buttonText: Style.ncTextColor
-                    light: Style.lightHover
-                    midlight: Style.lightHover
-                    mid: Style.ncSecondaryTextColor
-                    dark: Style.menuBorder
-                    button: Style.menuBorder
-                    window: Style.backgroundColor
-                    base: Style.backgroundColor
-                }
-
+                palette.window: palette.dark // NOTE: Fusion theme uses darker window colour for the border of the progress bar
                 value: syncStatus.syncProgress
             }
         }
@@ -95,7 +82,7 @@ RowLayout {
 
             text: syncStatus.syncStatusDetailString
             visible: syncStatus.syncStatusDetailString !== ""
-            color: Style.ncSecondaryTextColor
+            color: palette.midlight
             font.pixelSize: Style.subLinePixelSize
             wrapMode: Text.Wrap
         }

src/gui/tray/TalkReplyTextField.qml

@@ -13,7 +13,6 @@ TextField {
 
     height: Style.talkReplyTextFieldPreferredHeight
     visible: model.messageSent === ""
-    color: Style.ncTextColor
     placeholderText: qsTr("Reply to …")
 
     onAccepted: sendReplyMessage()
@@ -22,8 +21,8 @@ TextField {
         id: replyMessageTextFieldBorder
         radius: width / 2
         border.width: Style.normalBorderWidth
-        border.color: replyMessageTextField.activeFocus ? UserModel.currentUser.accentColor : Style.menuBorder
-        color: Style.backgroundColor
+        border.color: replyMessageTextField.activeFocus ? UserModel.currentUser.accentColor : palette.dark
+        color: palette.window
     }
 
     Button {
@@ -39,8 +38,8 @@ TextField {
         background: null
 
         icon {
-            source: "image://svgimage-custom-color/send.svg" + "/" + Style.menuBorder
-            color: hovered || !sendReplyMessageButton.enabled ? Style.menuBorder : UserModel.currentUser.accentColor
+            source: "image://svgimage-custom-color/send.svg" + "/" + palette.dark
+            color: hovered || !sendReplyMessageButton.enabled ? palette.dark : UserModel.currentUser.accentColor
         }
 
         anchors {

src/gui/tray/TextButtonContents.qml

@@ -20,8 +20,8 @@ import Style 1.0
 
 EnforcedPlainTextLabel {
     property bool hovered: false
-    property color textColor: Style.ncTextColor
-    property color textColorHovered: Style.ncSecondaryTextColor
+    property color textColor: palette.windowText
+    property color textColorHovered: palette.midlight
     property bool bold: false
 
     font.underline: true

src/gui/tray/TrayFolderListItem.qml

@@ -21,7 +21,7 @@ MenuItem {
     id: root
 
     property string subline: ""
-    property string iconSource: "image://svgimage-custom-color/folder-group.svg/" + Style.ncTextColor
+    property string iconSource: "image://svgimage-custom-color/folder-group.svg/" + palette.buttonText
     property string toolTipText: root.text
 
     NCToolTip {
@@ -35,7 +35,7 @@ MenuItem {
         Rectangle {
             anchors.fill: parent
             anchors.margins: Style.normalBorderWidth
-            color: parent.parent.hovered || parent.parent.visualFocus ? Style.lightHover : "transparent"
+            color: parent.parent.hovered || parent.parent.visualFocus ? palette.highlight : "transparent"
         }
     }
 

src/gui/tray/TrayFoldersMenuButton.qml

@@ -44,7 +44,6 @@ HeaderButton {
     visible: currentUser.hasLocalFolder
     display: AbstractButton.IconOnly
     flat: true
-    palette: Style.systemPalette
 
     Accessible.role: root.userHasGroupFolders ? Accessible.ButtonMenu : Accessible.Button
     Accessible.name: tooltip.text
@@ -186,7 +185,9 @@ HeaderButton {
                         subline: model.modelData.parentPath
                         width: foldersMenuListView.width
                         height: Style.standardPrimaryButtonHeight
-                        iconSource: !isGroupFolder ? "image://svgimage-custom-color/folder.svg/" + Style.ncTextColor : "image://svgimage-custom-color/folder-group.svg/" + Style.ncTextColor
+                        iconSource: !isGroupFolder ?
+                                        "image://svgimage-custom-color/folder.svg/" + palette.buttonText :
+                                        "image://svgimage-custom-color/folder-group.svg/" + palette.buttonText
 
                         onTriggered: {
                             foldersMenu.close();

src/gui/tray/UnifiedSearchInputContainer.qml

@@ -25,7 +25,7 @@ TextField {
 
     property bool isSearchInProgress: false
 
-    readonly property color textFieldIconsColor: Style.menuBorder
+    readonly property color textFieldIconsColor: palette.dark
 
     readonly property int textFieldIconsOffset: Style.trayHorizontalMargin
 
@@ -42,13 +42,13 @@ TextField {
 
     selectByMouse: true
 
-    palette.text: Style.ncSecondaryTextColor
+    palette.text: palette.midlight
 
     background: Rectangle {
         radius: 5
-        border.color: parent.activeFocus ? UserModel.currentUser.accentColor : Style.menuBorder
+        border.color: parent.activeFocus ? UserModel.currentUser.accentColor : palette.dark
         border.width: 1
-        color: Style.backgroundColor
+        color: palette.window
     }
 
     Image {

src/gui/tray/UnifiedSearchResultFetchMoreTrigger.qml

@@ -26,7 +26,7 @@ ColumnLayout {
 
     property int fontSize: Style.unifiedSearchResultTitleFontSize
 
-    property string textColor: Style.ncSecondaryTextColor
+    property string textColor: palette.midlight
 
     Accessible.role: Accessible.ListItem
     Accessible.name: unifiedSearchResultItemFetchMoreText.text

src/gui/tray/UnifiedSearchResultItem.qml

@@ -35,8 +35,8 @@ RowLayout {
     property int titleFontSize: Style.unifiedSearchResultTitleFontSize
     property int sublineFontSize: Style.unifiedSearchResultSublineFontSize
 
-    property color titleColor: Style.ncTextColor
-    property color sublineColor: Style.ncSecondaryTextColor
+    property color titleColor: palette.buttonText
+    property color sublineColor: palette.midlight
 
 
     Accessible.role: Accessible.ListItem

src/gui/tray/UnifiedSearchResultItemSkeleton.qml

@@ -51,7 +51,7 @@ RowLayout {
     * one single gradient sweeping over the base color components
     */
 
-    property color baseGradientColor: Style.lightHover
+    property color baseGradientColor: palette.light
     property int animationRectangleWidth: Style.trayWindowWidth
 
     Item {

src/gui/tray/UnifiedSearchResultItemSkeletonContainer.qml

@@ -45,7 +45,7 @@ ColumnLayout {
             id: placeholderSectionHeaderRectangle
             anchors.fill: parent
             radius: Style.veryRoundedButtonRadius
-            color: Style.lightHover
+            color: palette.light
             clip: true
             visible: false
 

src/gui/tray/UnifiedSearchResultItemSkeletonGradientRectangle.qml

@@ -22,7 +22,7 @@ import Style 1.0
 Rectangle {
     id: root
 
-    property color progressGradientColor: Style.darkMode ? Qt.lighter(Style.lightHover, 1.2) : Qt.darker(Style.lightHover, 1.1)
+    property color progressGradientColor: Style.darkMode ? Qt.lighter(palette.light, 1.2) : Qt.darker(palette.light, 1.1)
     property int animationStartX: -width
     property int animationEndX: width
 

src/gui/tray/UnifiedSearchResultListItem.qml

@@ -46,7 +46,7 @@ MouseArea {
     Rectangle {
         id: unifiedSearchResultHoverBackground
         anchors.fill: parent
-        color: (parent.containsMouse ? Style.lightHover : "transparent")
+        color: (parent.containsMouse ? palette.highlight : "transparent")
     }
 
     Loader {

src/gui/tray/UnifiedSearchResultNothingFound.qml

@@ -38,7 +38,7 @@ ColumnLayout {
     EnforcedPlainTextLabel {
         id: unifiedSearchResultsNoResultsLabel
         text: qsTr("No results for")
-        color: Style.menuBorder
+        color: palette.dark
         font.pixelSize: Style.subLinePixelSize * 1.25
         wrapMode: Text.Wrap
         Layout.fillWidth: true
@@ -49,7 +49,6 @@ ColumnLayout {
     EnforcedPlainTextLabel {
         id: unifiedSearchResultsNoResultsLabelDetails
         text: unifiedSearchResultNothingFoundContainer.text
-        color: Style.ncTextColor
         font.pixelSize: Style.topLinePixelSize * 1.25
         wrapMode: Text.Wrap
         maximumLineCount: 2

src/gui/tray/UserLine.qml

@@ -37,7 +37,9 @@ AbstractButton {
     background: Rectangle {
         anchors.fill: parent
         anchors.margins: 1
-        color: (userLine.hovered || userLine.visualFocus) && !(userMoreButton.hovered || userMoreButton.visualFocus) ? Style.lightHover : Style.backgroundColor
+        color: (userLine.hovered || userLine.visualFocus) &&
+               !(userMoreButton.hovered || userMoreButton.visualFocus) ?
+                   palette.highlight : palette.base
     }
 
     contentItem: RowLayout {
@@ -92,7 +94,6 @@ AbstractButton {
                 verticalAlignment: Text.AlignBottom
                 text: name
                 elide: Text.ElideRight
-                color: Style.ncTextColor
                 font.pixelSize: Style.topLinePixelSize
                 font.bold: true
             }
@@ -118,7 +119,6 @@ AbstractButton {
                     visible: model.statusMessage !== ""
                     text: statusMessage
                     elide: Text.ElideRight
-                    color: Style.ncTextColor
                     font.pixelSize: Style.subLinePixelSize
                     leftPadding: Style.accountLabelsSpacing
                 }
@@ -131,7 +131,6 @@ AbstractButton {
                 verticalAlignment: Text.AlignTop
                 text: server
                 elide: Text.ElideRight
-                color: Style.ncTextColor
                 font.pixelSize: Style.subLinePixelSize
             }
         }
@@ -143,7 +142,7 @@ AbstractButton {
             flat: true
 
             icon.source: "qrc:///client/theme/more.svg"
-            icon.color: Style.ncTextColor
+            icon.color: palette.buttonText
 
             Accessible.role: Accessible.ButtonMenu
             Accessible.name: qsTr("Account actions")
@@ -153,19 +152,13 @@ AbstractButton {
             background: Rectangle {
                 anchors.fill: parent
                 anchors.margins: 1
-                color: userMoreButton.hovered || userMoreButton.visualFocus ? Style.lightHover : "transparent"
+                color: userMoreButton.hovered || userMoreButton.visualFocus ? palette.highlight : "transparent"
             }
 
             AutoSizingMenu {
                 id: userMoreButtonMenu
                 closePolicy: Menu.CloseOnPressOutsideParent | Menu.CloseOnEscape
 
-                background: Rectangle {
-                    border.color: Style.menuBorder
-                    color: Style.backgroundColor
-                    radius: 2
-                }
-
                 MenuItem {
                     visible: model.isConnected && model.serverHasUserStatus
                     height: visible ? implicitHeight : 0
@@ -174,16 +167,6 @@ AbstractButton {
                     palette.windowText: Style.ncTextColor
                     hoverEnabled: true
                     onClicked: showUserStatusSelector(index)
-
-                    background: Item {
-                        height: parent.height
-                        width: parent.menu.width
-                        Rectangle {
-                            anchors.fill: parent
-                            anchors.margins: 1
-                            color: parent.parent.hovered ? Style.lightHover : "transparent"
-                        }
-                    }
                 }
 
                 MenuItem {
@@ -202,7 +185,7 @@ AbstractButton {
                         Rectangle {
                             anchors.fill: parent
                             anchors.margins: 1
-                            color: parent.parent.hovered ? Style.lightHover : "transparent"
+                            color: parent.parent.hovered ? palette.highlight : "transparent"
                         }
                     }
 
@@ -236,7 +219,7 @@ AbstractButton {
                         Rectangle {
                             anchors.fill: parent
                             anchors.margins: 1
-                            color: parent.parent.hovered ? Style.lightHover : "transparent"
+                            color: parent.parent.hovered ? palette.highlight : "transparent"
                         }
                     }
 

src/gui/tray/Window.qml

@@ -37,6 +37,26 @@ ApplicationWindow {
     color:      "transparent"
     flags:      Systray.useNormalWindow ? Qt.Window : Qt.Dialog | Qt.FramelessWindowHint
 
+    // TODO: Rather than setting all these palette colours manually,
+    // create a custom style and do it for all components globally
+    palette {
+        text: Style.ncTextColor
+        windowText: Style.ncTextColor
+        buttonText: Style.ncTextColor
+        brightText: Style.ncTextBrightColor
+        highlight: Style.lightHover
+        highlightedText: Style.ncTextColor
+        light: Style.lightHover
+        midlight: Style.ncSecondaryTextColor
+        mid: Style.darkerHover
+        dark: Style.menuBorder
+        button: Style.buttonBackgroundColor
+        window: Style.backgroundColor
+        base: Style.backgroundColor
+        toolTipBase: Style.backgroundColor
+        toolTipText: Style.ncTextColor
+    }
+
     readonly property int maxMenuHeight: Style.trayWindowHeight - Style.trayWindowHeaderHeight - 2 * Style.trayWindowBorderWidth
 
     Component.onCompleted: Systray.forceWindowInit(trayWindow)
@@ -62,8 +82,8 @@ ApplicationWindow {
     background: Rectangle {
         radius: Systray.useNormalWindow ? 0.0 : Style.trayWindowRadius
         border.width: Style.trayWindowBorderWidth
-        border.color: Style.menuBorder
-        color: Style.backgroundColor
+        border.color: palette.dark
+        color: palette.window
     }
 
     Connections {
@@ -138,8 +158,8 @@ ApplicationWindow {
         background: Rectangle {
             radius: Systray.useNormalWindow ? 0.0 : Style.trayWindowRadius
             border.width: Style.trayWindowBorderWidth
-            border.color: Style.menuBorder
-            color: Style.backgroundColor
+            border.color: palette.dark
+            color: palette.window
         }
 
         property int userIndex: 0
@@ -175,8 +195,8 @@ ApplicationWindow {
         background: Rectangle {
             radius: Systray.useNormalWindow ? 0.0 : Style.trayWindowRadius
             border.width: Style.trayWindowBorderWidth
-            border.color: Style.menuBorder
-            color: Style.backgroundColor
+            border.color: palette.dark
+            color: palette.window
         }
 
         property var folderAccountState: ({})
@@ -257,7 +277,6 @@ ApplicationWindow {
                     Layout.preferredHeight: Style.trayWindowHeaderHeight
                     display:                AbstractButton.IconOnly
                     flat:                   true
-                    palette: Style.systemPalette
 
                     Accessible.role: Accessible.ButtonMenu
                     Accessible.name: qsTr("Current account")
@@ -285,11 +304,10 @@ ApplicationWindow {
                         width: (Style.currentAccountButtonWidth - 2)
                         height: Math.min(implicitHeight, maxMenuHeight)
                         closePolicy: Menu.CloseOnPressOutsideParent | Menu.CloseOnEscape
-                        palette: Style.palette
 
                         background: Rectangle {
-                            border.color: Style.menuBorder
-                            color: Style.backgroundColor
+                            border.color: palette.dark
+                            color: palette.base
                             radius: Style.currentAccountButtonRadius
                         }
 
@@ -334,7 +352,6 @@ ApplicationWindow {
                             id: addAccountButton
                             height: Style.addAccountButtonHeight
                             hoverEnabled: true
-                            palette: Theme.systemPalette
 
                             background: Item {
                                 height: parent.height
@@ -342,7 +359,7 @@ ApplicationWindow {
                                 Rectangle {
                                     anchors.fill: parent
                                     anchors.margins: 1
-                                    color: parent.parent.hovered || parent.parent.visualFocus ? Style.lightHover : "transparent"
+                                    color: parent.parent.hovered || parent.parent.visualFocus ? palette.highlight : "transparent"
                                 }
                             }
 
@@ -360,7 +377,6 @@ ApplicationWindow {
                                 EnforcedPlainTextLabel {
                                     Layout.leftMargin: 14
                                     text: qsTr("Add account")
-                                    color: Style.ncTextColor
                                     font.pixelSize: Style.topLinePixelSize
                                 }
                                 // Filler on the right
@@ -380,13 +396,12 @@ ApplicationWindow {
                             anchors.left: parent.left
                             anchors.right: parent.right
                             implicitHeight: 1
-                            color: Style.menuBorder
+                            color: palette.dark
                         }
 
                         MenuItem {
                             id: syncPauseButton
                             font.pixelSize: Style.topLinePixelSize
-                            palette.windowText: Style.ncTextColor
                             hoverEnabled: true
                             onClicked: Systray.syncIsPaused = !Systray.syncIsPaused
 
@@ -396,7 +411,7 @@ ApplicationWindow {
                                 Rectangle {
                                     anchors.fill: parent
                                     anchors.margins: 1
-                                    color: parent.parent.hovered || parent.parent.visualFocus ? Style.lightHover : "transparent"
+                                    color: parent.parent.hovered || parent.parent.visualFocus ? palette.highlight : "transparent"
                                 }
                             }
 
@@ -409,7 +424,6 @@ ApplicationWindow {
                             id: settingsButton
                             text: qsTr("Settings")
                             font.pixelSize: Style.topLinePixelSize
-                            palette.windowText: Style.ncTextColor
                             hoverEnabled: true
                             onClicked: Systray.openSettings()
 
@@ -419,7 +433,7 @@ ApplicationWindow {
                                 Rectangle {
                                     anchors.fill: parent
                                     anchors.margins: 1
-                                    color: parent.parent.hovered || parent.parent.visualFocus ? Style.lightHover : "transparent"
+                                    color: parent.parent.hovered || parent.parent.visualFocus ? palette.highlight : "transparent"
                                 }
                             }
 
@@ -432,7 +446,6 @@ ApplicationWindow {
                             id: exitButton
                             text: qsTr("Exit");
                             font.pixelSize: Style.topLinePixelSize
-                            palette.windowText: Style.ncTextColor
                             hoverEnabled: true
                             onClicked: Systray.shutdown()
 
@@ -442,7 +455,7 @@ ApplicationWindow {
                                 Rectangle {
                                     anchors.fill: parent
                                     anchors.margins: 1
-                                    color: parent.parent.hovered || parent.parent.visualFocus ? Style.lightHover : "transparent"
+                                    color: parent.parent.hovered || parent.parent.visualFocus ? palette.highlight : "transparent"
                                 }
                             }
 
@@ -656,8 +669,8 @@ ApplicationWindow {
                         closePolicy: Menu.CloseOnPressOutsideParent | Menu.CloseOnEscape
 
                         background: Rectangle {
-                            border.color: Style.menuBorder
-                            color: Style.backgroundColor
+                            border.color: palette.dark
+                            color: palette.base
                             radius: 2
                         }
 
@@ -682,9 +695,8 @@ ApplicationWindow {
 
                                     text: model.appName
                                     font.pixelSize: Style.topLinePixelSize
-                                    palette.windowText: Style.ncTextColor
                                     icon.source: model.appIconUrl
-                                    icon.color: Style.ncTextColor
+                                    icon.color: palette.buttonText
                                     onTriggered: UserAppsModel.openAppUrl(appUrl)
                                     hoverEnabled: true
 
@@ -694,7 +706,7 @@ ApplicationWindow {
                                         Rectangle {
                                             anchors.fill: parent
                                             anchors.margins: 1
-                                            color: parent.parent.hovered || parent.parent.visualFocus ? Style.lightHover : "transparent"
+                                            color: parent.parent.hovered || parent.parent.visualFocus ? palette.highlight : "transparent"
                                         }
                                     }
 

theme/Style/Style.qml

@@ -11,9 +11,10 @@ QtObject {
     // Colors
     readonly property color ncBlue:      Theme.wizardHeaderBackgroundColor
     readonly property color ncTextColor: Theme.systemPalette.windowText
+    readonly property color ncTextBrightColor: "white"
     readonly property color ncSecondaryTextColor: "#808080"
-    readonly property color ncHeaderTextColor: "white"
     readonly property color lightHover: Theme.darkMode ? Qt.lighter(backgroundColor, 2) : Qt.darker(backgroundColor, 1.05)
+    readonly property color darkerHover: Theme.darkMode ? Qt.lighter(backgroundColor, 2.35) : Qt.darker(backgroundColor, 1.25)
     readonly property color menuBorder: Theme.darkMode ? Qt.lighter(backgroundColor, 2.5) : Qt.darker(backgroundColor, 1.5)
     readonly property color backgroundColor: Theme.systemPalette.base
     readonly property color buttonBackgroundColor: Theme.systemPalette.button
@@ -56,8 +57,9 @@ QtObject {
 
     property int iconButtonWidth: 36
     property int standardPrimaryButtonHeight: 40
+    readonly property int smallIconSize: 16
 
-    property int minActivityHeight: variableSize(40)
+    property int minActivityHeight: variableSize(32)
 
     property int currentAccountButtonWidth: 220
     property int currentAccountButtonRadius: 2
@@ -84,7 +86,7 @@ QtObject {
     property int addAccountButtonHeight: 50
 
     property int headerButtonIconSize: 32
-    property int dismissButtonSize: 16
+    property int dismissButtonSize: 26
     property int minimumActivityItemHeight: 24
 
     property int activityLabelBaseWidth: 240
@@ -138,8 +140,6 @@ QtObject {
     readonly property int minimumWidthResolveConflictsDialog: 600
     readonly property int minimumHeightResolveConflictsDialog: 800
 
-    readonly property int activityContentSpace: 4
-
     readonly property double smallIconScaleFactor: 0.6
 
     readonly property double trayFolderListButtonWidthScaleFactor: 1.75