Merge #262 [stable-3.13] nmc/2055-Changes to Main window (Icons and h…

…eader logo)

resources.qrc

@@ -1,5 +1,7 @@
 <RCC>
     <qresource prefix="/qml">
+        <file>src/gui/nmcgui/NMCHeaderButton.qml</file>
+        <file>src/gui/nmcgui/NMCMenuItem.qml</file>
         <file>src/gui/UserStatusSelector.qml</file>
         <file>src/gui/UserStatusSelectorPage.qml</file>
         <file>src/gui/EmojiPicker.qml</file>

src/gui/nmcgui/NMCHeaderButton.qml

@@ -0,0 +1,74 @@
+/*
+ * Copyright (C) 2024 by Eugen Fischer
+ *
+ * This program is free software; you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation; either version 2 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful, but
+ * WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY
+ * or FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License
+ * for more details.
+ */
+
+import QtQml 2.15
+import QtQml.Models 2.15
+import QtQuick 2.15
+import QtQuick.Window 2.15
+import QtQuick.Controls 2.15
+import QtQuick.Layouts 1.15
+import QtGraphicalEffects 1.15
+
+// Custom qml modules are in /theme (and included by resources.qrc)
+import Style 1.0
+import com.nextcloud.desktopclient 1.0
+
+Item{
+    id: rec
+
+    width: 92
+    height: Style.nmcTrayWindowHeaderHeight
+
+    signal clickedButton
+
+    property string iconText: ""
+    property string iconSource: ""
+    property bool iconHovered: false
+
+    ColumnLayout{
+
+        spacing: 0
+        anchors.centerIn: parent
+
+        Button {
+            id: button
+            flat: true
+            icon.source: rec.iconSource
+            icon.width: Style.nmcTrayWindowIconWidth
+            icon.height: Style.nmcTrayWindowIconWidth
+
+            onClicked: {
+                rec.clickedButton()
+            }
+
+            background: Rectangle {
+                    color: iconHovered || button.visualFocus ? "black" : "transparent"
+                    opacity: 0.05
+            }
+            Layout.alignment: Qt.AlignHCenter
+        }
+
+        Text {
+            width: rec.width
+            text: rec.iconText
+            elide: Text.ElideRight
+            color: Style.nmcTrayWindowHeaderTextColor
+            font.pixelSize: Style.nmcFontSizeIconText
+            font.bold: false
+            leftPadding: 8
+            rightPadding: 8
+        }
+    }
+}
+

src/gui/nmcgui/NMCMenuItem.qml

@@ -0,0 +1,26 @@
+/*
+ * Copyright (C) 2023 by Eugen Fischer
+ *
+ * This program is free software; you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation; either version 2 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful, but
+ * WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY
+ * or FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License
+ * for more details.
+ */
+
+import QtQml 2.15
+import QtQuick 2.15
+import QtQuick.Controls 2.15
+
+import Style 1.0
+
+MenuItem {
+    icon.color: hovered ? Style.ncBlue : Style.ncTextColor
+    palette.windowText: hovered ? Style.nmcTrayWindowHeaderTextColor : Style.nmcTrayWindowHeaderTextColor
+    hoverEnabled: true
+    font.pixelSize: Style.topLinePixelSize
+}

src/gui/tray/ActivityItemActions.qml

@@ -44,11 +44,22 @@ Repeater {
 
         onClicked: isTalkReplyButton ? root.showReplyField() : root.triggerAction(model.index)
 
-        textColor: Style.adjustedCurrentUserHeaderColor
-        textColorHovered: Style.currentUserHeaderTextColor
+        textColor: Style.nmcTextInButtonColor
+        textColorHovered: Style.nmcTextInButtonColor
         contentsFont.bold: true
         bgColor: Style.currentUserHeaderColor
 
         visible: verb !== "REPLY" || (verb === "REPLY" && root.talkReplyButtonVisible)
+
+        HoverHandler {
+            id: mouse
+            acceptedDevices: PointerDevice.Mouse
+        }
+
+        background: Rectangle {
+            color: mouse.hovered? Style.nmcConflictHoverColor : Style.nmcConflictColor
+            radius: Style.nmcStandardRadius
+            height: Style.nmcTraySyncButtonHeight
+        }
     }
 }

src/gui/tray/ActivityItemContent.qml

@@ -26,8 +26,8 @@ RowLayout {
     Item {
         id: thumbnailItem
 
-        readonly property int imageWidth: width * (1 - Style.thumbnailImageSizeReduction)
-        readonly property int imageHeight: height * (1 - Style.thumbnailImageSizeReduction)
+        readonly property int imageWidth: width //* (1 - Style.thumbnailImageSizeReduction)
+        readonly property int imageHeight: height //* (1 - Style.thumbnailImageSizeReduction)
         readonly property int thumbnailRadius: model.thumbnail && model.thumbnail.isUserAvatar ? width / 2 : 3
 
         implicitWidth: root.iconSize
@@ -177,7 +177,7 @@ RowLayout {
                 bgColor: palette.mid
                 bgNormalOpacity:  0
 
-                visible: model.showFileDetails
+                visible: false
 
                 onClicked: Systray.presentShareViewInTray(model.openablePath)
             }

src/gui/tray/ActivityList.qml

@@ -85,8 +85,9 @@ ScrollView {
             background: null
             width: activityList.contentItem.width
 
+            leftPadding: Style.nmcListViewLeftPadding
             isFileActivityList: controlRoot.isFileActivityList
-            iconSize: controlRoot.iconSize
+            iconSize: Style.nmcListViewIconSize
             flickable: activityList
             onHoveredChanged: if (hovered) {
                 // When we set the currentIndex the list view will scroll...

src/gui/tray/NCProgressBar.qml

@@ -22,10 +22,10 @@ ProgressBar {
     background: Rectangle {
         implicitWidth: Style.progressBarWidth
         implicitHeight: Style.progressBarBackgroundHeight
-        radius: Style.progressBarRadius
-        color: Style.progressBarBackgroundColor
+        radius: Style.nmcStandardRadius
+        color: Style.nmcTrayWindowHeaderHighlightColor
         border.color: Style.progressBarBackgroundBorderColor
-        border.width: Style.progressBarBackgroundBorderWidth
+        border.width: 0 //Style.progressBarBackgroundBorderWidth
     }
 
     contentItem: Item {
@@ -36,9 +36,9 @@ ProgressBar {
             width: control.visualPosition * parent.width
             height: parent.height
             radius: Style.progressBarRadius
-            color: Style.progressBarContentColor
+            color: Style.nmcTelekomMagentaColor
             border.color: Style.progressBarContentBorderColor
-            border.width: Style.progressBarContentBorderWidth
+            border.width: 0
         }
     }
 }

src/gui/tray/SyncStatus.qml

@@ -29,7 +29,7 @@ RowLayout {
         Layout.topMargin: 16
         Layout.rightMargin: whiteSpace * (0.5 + Style.thumbnailImageSizeReduction)
         Layout.bottomMargin: 16
-        Layout.leftMargin: Style.trayHorizontalMargin + (whiteSpace * (0.5 - Style.thumbnailImageSizeReduction))
+        Layout.leftMargin: Style.nmcListViewLeftPadding
 
         padding: 0
 
@@ -47,14 +47,16 @@ RowLayout {
         Layout.fillWidth: true
         Layout.fillHeight: true
 
+        Layout.leftMargin: Style.nmcProgressFieldTextOffset
+
         EnforcedPlainTextLabel {
             id: syncProgressText
 
             Layout.fillWidth: true
 
             text: syncStatus.syncStatusString
             verticalAlignment: Text.AlignVCenter
-            font.pixelSize: Style.topLinePixelSize
+            font.pixelSize: Style.nmcFontSizeSyncText
             font.bold: true
             wrapMode: Text.Wrap
         }
@@ -78,7 +80,7 @@ RowLayout {
             Layout.fillWidth: true
 
             text: syncStatus.syncStatusDetailString
-            visible: syncStatus.syncStatusDetailString !== ""
+            visible: false
             color: palette.midlight
             font.pixelSize: Style.subLinePixelSize
             wrapMode: Text.Wrap
@@ -88,17 +90,17 @@ RowLayout {
     CustomButton {
         id: syncNowButton
 
-        FontMetrics {
-            id: syncNowFm
-            font: syncNowButton.contentsFont
-        }
+        // FontMetrics {
+        //     id: syncNowFm
+        //     font: syncNowButton.contentsFont
+        // }
 
         Layout.rightMargin: Style.trayHorizontalMargin
 
         text: qsTr("Sync now")
 
         padding: Style.smallSpacing
-        textColor: Style.adjustedCurrentUserHeaderColor
+        textColor: Style.nmcTextInButtonColor
         textColorHovered: Style.currentUserHeaderTextColor
         contentsFont.bold: true
         bgColor: Style.currentUserHeaderColor
@@ -113,6 +115,17 @@ RowLayout {
                 NC.UserModel.currentUser.forceSyncNow();
             }
         }
+
+        HoverHandler {
+            id: mouseSync
+            acceptedDevices: PointerDevice.Mouse
+        }
+
+        background: Rectangle {
+            color: mouseSync.hovered? Style.nmcSyncHoverColor : Style.nmcTelekomMagentaColor
+            radius: Style.nmcStandardRadius
+            height: Style.nmcTraySyncButtonHeight
+        }
     }
 
     CustomButton {
@@ -123,8 +136,9 @@ RowLayout {
         Layout.rightMargin: Style.trayHorizontalMargin
 
         text: qsTr("Resolve conflicts")
-        textColor: Style.adjustedCurrentUserHeaderColor
-        textColorHovered: Style.currentUserHeaderTextColor
+        padding: Style.smallSpacing
+        textColor: Style.nmcTextInButtonColor
+        textColorHovered: Style.nmcTextInButtonColor
         contentsFont.bold: true
         bgColor: Style.currentUserHeaderColor
 
@@ -134,5 +148,16 @@ RowLayout {
                  NC.UserModel.currentUser.isConnected
         enabled: visible
         onClicked: NC.Systray.createResolveConflictsDialog(activityModel.allConflicts);
+
+        HoverHandler {
+            id: mouseConflict
+            acceptedDevices: PointerDevice.Mouse
+        }
+
+        background: Rectangle {
+            color: mouseConflict.hovered? Style.nmcConflictHoverColor : Style.nmcConflictColor
+            radius: Style.nmcStandardRadius
+            height: Style.nmcTraySyncButtonHeight
+        }
     }
 }