diff --git a/resources.qrc b/resources.qrc index 630251749749c..3733a5a73a710 100644 --- a/resources.qrc +++ b/resources.qrc @@ -25,10 +25,11 @@ src/gui/tray/UserLine.qml src/gui/tray/HeaderButton.qml src/gui/tray/SyncStatus.qml - src/gui/tray/ActivityActionButton.qml src/gui/tray/ActivityItem.qml src/gui/tray/AutoSizingMenu.qml src/gui/tray/ActivityList.qml + src/gui/tray/CurrentAccountHeaderButton.qml + src/gui/tray/TrayWindowHeader.qml src/gui/tray/UnifiedSearchInputContainer.qml src/gui/tray/UnifiedSearchResultFetchMoreTrigger.qml src/gui/tray/UnifiedSearchResultItem.qml @@ -38,10 +39,6 @@ src/gui/tray/UnifiedSearchResultListItem.qml src/gui/tray/UnifiedSearchResultNothingFound.qml src/gui/tray/UnifiedSearchResultSectionItem.qml - src/gui/tray/CustomButton.qml - src/gui/tray/NCButtonContents.qml - src/gui/tray/NCButtonBackground.qml - src/gui/tray/TextButtonContents.qml src/gui/tray/ActivityItemContextMenu.qml src/gui/tray/ActivityItemActions.qml src/gui/tray/ActivityItemContent.qml diff --git a/src/gui/ResolveConflictsDialog.qml b/src/gui/ResolveConflictsDialog.qml index af404fba41fd6..a4b8474cd47f1 100644 --- a/src/gui/ResolveConflictsDialog.qml +++ b/src/gui/ResolveConflictsDialog.qml @@ -167,7 +167,7 @@ ApplicationWindow { } Rectangle { - color: Style.backgroundColor + color: palette.base anchors.fill: parent z: 1 } diff --git a/src/gui/UserStatusSelector.qml b/src/gui/UserStatusSelector.qml index 2c2dcbf0d8f6f..e20f58890537a 100644 --- a/src/gui/UserStatusSelector.qml +++ b/src/gui/UserStatusSelector.qml @@ -130,20 +130,18 @@ ColumnLayout { Layout.fillWidth: true spacing: 0 - UserStatusSelectorButton { + AbstractButton { id: fieldButton + readonly property bool showBorder: hovered || checked || emojiDialog.visible + Layout.preferredWidth: userStatusMessageTextField.height Layout.preferredHeight: userStatusMessageTextField.height text: userStatusSelectorModel.userStatusEmoji - - onClicked: emojiDialog.open() - onHeightChanged: topButtonsLayout.maxButtonHeight = Math.max(topButtonsLayout.maxButtonHeight, height) - - primary: true padding: 0 - z: hovered ? 2 : 0 // Make sure highlight is seen on top of text field + z: showBorder ? 2 : 0 // Make sure highlight is seen on top of text field + hoverEnabled: true property color borderColor: showBorder ? Style.ncBlue : palette.dark @@ -175,6 +173,15 @@ ColumnLayout { color: palette.button } } + + contentItem: Label { + text: fieldButton.text + textFormat: Text.PlainText + horizontalAlignment: Text.AlignHCenter + verticalAlignment: Text.AlignVCenter + } + + onClicked: emojiDialog.open() } Popup { @@ -186,7 +193,7 @@ ColumnLayout { anchors.centerIn: Overlay.overlay background: Rectangle { - color: palette.window + color: palette.base border.width: Style.normalBorderWidth border.color: palette.dark radius: Style.slightlyRoundedButtonRadius @@ -211,7 +218,7 @@ ColumnLayout { Layout.preferredHeight: contentHeight + (Style.smallSpacing * 2) placeholderText: qsTr("What is your status?") - placeholderTextColor: palette.midlight + placeholderTextColor: palette.dark text: userStatusSelectorModel.userStatusMessage verticalAlignment: TextInput.AlignVCenter selectByMouse: true diff --git a/src/gui/UserStatusSelectorPage.qml b/src/gui/UserStatusSelectorPage.qml index c40654b6f0505..a60423f9a77f5 100644 --- a/src/gui/UserStatusSelectorPage.qml +++ b/src/gui/UserStatusSelectorPage.qml @@ -32,7 +32,7 @@ Page { padding: Style.standardSpacing * 2 background: Rectangle { - color: palette.window + color: palette.base radius: Style.trayWindowRadius } diff --git a/src/gui/filedetails/FileDetailsPage.qml b/src/gui/filedetails/FileDetailsPage.qml index 6c0bac5af3899..5b281720e952c 100644 --- a/src/gui/filedetails/FileDetailsPage.qml +++ b/src/gui/filedetails/FileDetailsPage.qml @@ -69,7 +69,7 @@ Page { bottomPadding: intendedPadding background: Rectangle { - color: palette.window + color: palette.base visible: root.backgroundsVisible } @@ -130,7 +130,7 @@ Page { wrapMode: Text.Wrap } - CustomButton { + Button { id: closeButton Layout.rowSpan: headerGridLayout.rows @@ -142,10 +142,7 @@ Page { icon.source: "image://svgimage-custom-color/clear.svg" + "/" + palette.buttonText icon.width: Style.activityListButtonIconSize icon.height: Style.activityListButtonIconSize - toolTipText: qsTr("Dismiss") - visible: root.showCloseButton - onClicked: root.closeButtonClicked() } diff --git a/src/gui/filedetails/FileDetailsView.qml b/src/gui/filedetails/FileDetailsView.qml index 3572c66f49905..991da7d2b91c1 100644 --- a/src/gui/filedetails/FileDetailsView.qml +++ b/src/gui/filedetails/FileDetailsView.qml @@ -31,7 +31,7 @@ StackView { property bool backgroundsVisible: true background: Rectangle { - color: palette.window + color: palette.base visible: root.backgroundsVisible } diff --git a/src/gui/filedetails/NCInputTextEdit.qml b/src/gui/filedetails/NCInputTextEdit.qml index d002caf269617..a2b95fc330dc6 100644 --- a/src/gui/filedetails/NCInputTextEdit.qml +++ b/src/gui/filedetails/NCInputTextEdit.qml @@ -27,7 +27,6 @@ TextEdit { 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.trayWindowRadius border.width: Style.normalBorderWidth border.color: root.activeFocus ? root.accentColor : root.secondaryColor - color: palette.window + color: palette.base z: -1 } diff --git a/src/gui/filedetails/NCTabButton.qml b/src/gui/filedetails/NCTabButton.qml index 2f53254489e05..48e2fecccabec 100644 --- a/src/gui/filedetails/NCTabButton.qml +++ b/src/gui/filedetails/NCTabButton.qml @@ -29,7 +29,7 @@ TabButton { padding: Style.smallSpacing background: Rectangle { radius: Style.slightlyRoundedButtonRadius - color: tabButton.pressed ? palette.highlight : palette.window + color: tabButton.pressed ? palette.highlight : "transparent" } contentItem: ColumnLayout { diff --git a/src/gui/filedetails/ShareDelegate.qml b/src/gui/filedetails/ShareDelegate.qml index 09dbb233584c7..895153fba632a 100644 --- a/src/gui/filedetails/ShareDelegate.qml +++ b/src/gui/filedetails/ShareDelegate.qml @@ -152,18 +152,17 @@ GridLayout { spacing: 0 - CustomButton { + Button { id: createLinkButton Layout.alignment: Qt.AlignCenter - Layout.preferredWidth: Style.iconButtonWidth - Layout.preferredHeight: width - - toolTipText: qsTr("Create a new share link") + Layout.preferredWidth: Style.activityListButtonWidth + Layout.preferredHeight: Style.activityListButtonHeight icon.source: "image://svgimage-custom-color/add.svg/" + palette.buttonText - icon.width: Style.smallIconSize - icon.height: Style.smallIconSize + icon.width: Style.activityListButtonIconSize + icon.height: Style.activityListButtonIconSize + display: AbstractButton.IconOnly visible: (root.isPlaceholderLinkShare || root.isSecureFileDropPlaceholderLinkShare) && root.canCreateLinkShares enabled: visible @@ -171,7 +170,7 @@ GridLayout { onClicked: root.createNewLinkShare() } - CustomButton { + Button { id: copyLinkButton function copyShareLink() { @@ -190,29 +189,17 @@ GridLayout { Layout.preferredWidth: shareLinkCopied ? implicitWidth : Style.activityListButtonWidth Layout.preferredHeight: Style.activityListButtonHeight - toolTipText: qsTr("Copy share link location") - text: shareLinkCopied ? qsTr("Copied!") : "" 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 - + icon.width: Style.activityListButtonIconSize + icon.height: Style.activityListButtonIconSize + display: AbstractButton.IconOnly visible: root.isLinkShare || root.isInternalLinkShare enabled: visible - onClicked: copyShareLink() - // TODO - // Behavior on bgColor { - // ColorAnimation { duration: Style.shortAnimationDuration } - // } - - // Behavior on bgNormalOpacity { - // NumberAnimation { duration: Style.shortAnimationDuration } - // } - Behavior on Layout.preferredWidth { SmoothedAnimation { duration: Style.shortAnimationDuration } } @@ -229,22 +216,19 @@ GridLayout { } } - CustomButton { + Button { id: moreButton - toolTipText: qsTr("Share options") - + Layout.alignment: Qt.AlignVCenter | Qt.AlignHCenter Layout.preferredWidth: Style.activityListButtonWidth Layout.preferredHeight: Style.activityListButtonHeight - Layout.alignment: Qt.AlignVCenter | Qt.AlignHCenter icon.source: "image://svgimage-custom-color/more.svg/" + palette.buttonText icon.width: Style.activityListButtonIconSize icon.height: Style.activityListButtonIconSize - + display: AbstractButton.IconOnly visible: !root.isPlaceholderLinkShare && !root.isSecureFileDropPlaceholderLinkShare && !root.isInternalLinkShare enabled: visible - onClicked: root.rootStackView.push(shareDetailsPageComponent, {}, StackView.PushTransition) Component { diff --git a/src/gui/filedetails/ShareDetailsPage.qml b/src/gui/filedetails/ShareDetailsPage.qml index bdb3ca96f0738..1ac69e1b38cbe 100644 --- a/src/gui/filedetails/ShareDetailsPage.qml +++ b/src/gui/filedetails/ShareDetailsPage.qml @@ -175,7 +175,7 @@ Page { padding: Style.standardSpacing * 2 background: Rectangle { - color: palette.window + color: palette.base visible: root.backgroundsVisible } @@ -220,7 +220,7 @@ Page { elide: Text.ElideRight } - CustomButton { + Button { id: closeButton Layout.rowSpan: headerGridLayout.rows @@ -232,8 +232,6 @@ Page { icon.source: "image://svgimage-custom-color/clear.svg" + "/" + palette.buttonText icon.width: Style.activityListButtonIconSize icon.height: Style.activityListButtonIconSize - toolTipText: qsTr("Dismiss") - onClicked: root.closeShareDetails() } @@ -262,6 +260,7 @@ Page { readonly property int itemPadding: Style.smallSpacing width: parent.width + spacing: Style.smallSpacing RowLayout { Layout.fillWidth: true @@ -315,7 +314,8 @@ Page { visible: active sourceComponent: CheckBox { spacing: scrollContentsColumn.indicatorSpacing - padding: scrollContentsColumn.itemPadding + leftPadding: scrollContentsColumn.itemPadding + rightPadding: scrollContentsColumn.itemPadding indicator.width: scrollContentsColumn.indicatorItemWidth indicator.height: scrollContentsColumn.indicatorItemWidth @@ -341,7 +341,7 @@ Page { visible: active sourceComponent: ColumnLayout { id: permissionRadioButtonsLayout - spacing: 0 + spacing: Layout.smallSpacing width: parent.width ButtonGroup { @@ -356,7 +356,8 @@ Page { checked: root.currentPermissionMode === permissionMode text: qsTr("View only") spacing: scrollContentsColumn.indicatorSpacing - padding: scrollContentsColumn.itemPadding + leftPadding: scrollContentsColumn.itemPadding + rightPadding: scrollContentsColumn.itemPadding onClicked: root.permissionModeChanged(permissionMode) } @@ -368,7 +369,8 @@ Page { checked: root.currentPermissionMode === permissionMode text: qsTr("Allow upload and editing") spacing: scrollContentsColumn.indicatorSpacing - padding: scrollContentsColumn.itemPadding + leftPadding: scrollContentsColumn.itemPadding + rightPadding: scrollContentsColumn.itemPadding onClicked: root.permissionModeChanged(permissionMode) } @@ -380,7 +382,8 @@ Page { checked: root.currentPermissionMode === permissionMode text: qsTr("File drop (upload only)") spacing: scrollContentsColumn.indicatorSpacing - padding: scrollContentsColumn.itemPadding + leftPadding: scrollContentsColumn.itemPadding + rightPadding: scrollContentsColumn.itemPadding onClicked: root.permissionModeChanged(permissionMode) } @@ -390,7 +393,8 @@ Page { Layout.fillWidth: true spacing: scrollContentsColumn.indicatorSpacing - padding: scrollContentsColumn.itemPadding + leftPadding: scrollContentsColumn.itemPadding + rightPadding: scrollContentsColumn.itemPadding indicator.width: scrollContentsColumn.indicatorItemWidth indicator.height: scrollContentsColumn.indicatorItemWidth @@ -429,7 +433,8 @@ Page { anchors.right: parent.right spacing: scrollContentsColumn.indicatorSpacing - padding: scrollContentsColumn.itemPadding + leftPadding: scrollContentsColumn.itemPadding + rightPadding: scrollContentsColumn.itemPadding indicator.width: scrollContentsColumn.indicatorItemWidth indicator.height: scrollContentsColumn.indicatorItemWidth @@ -454,7 +459,8 @@ Page { Layout.fillWidth: true spacing: scrollContentsColumn.indicatorSpacing - padding: scrollContentsColumn.itemPadding + leftPadding: scrollContentsColumn.itemPadding + rightPadding: scrollContentsColumn.itemPadding indicator.width: scrollContentsColumn.indicatorItemWidth indicator.height: scrollContentsColumn.indicatorItemWidth @@ -563,7 +569,8 @@ Page { Layout.fillWidth: true spacing: scrollContentsColumn.indicatorSpacing - padding: scrollContentsColumn.itemPadding + leftPadding: scrollContentsColumn.itemPadding + rightPadding: scrollContentsColumn.itemPadding indicator.width: scrollContentsColumn.indicatorItemWidth indicator.height: scrollContentsColumn.indicatorItemWidth @@ -647,7 +654,8 @@ Page { Layout.fillWidth: true spacing: scrollContentsColumn.indicatorSpacing - padding: scrollContentsColumn.itemPadding + leftPadding: scrollContentsColumn.itemPadding + rightPadding: scrollContentsColumn.itemPadding indicator.width: scrollContentsColumn.indicatorItemWidth indicator.height: scrollContentsColumn.indicatorItemWidth @@ -716,26 +724,21 @@ Page { } } - CustomButton { + Button { height: Style.standardPrimaryButtonHeight - - icon.source: "image://svgimage-custom-color/close.svg/" + Style.errorBoxBackgroundColor - imageSourceHover: "image://svgimage-custom-color/close.svg/" + palette.brightText + icon.source: "image://svgimage-custom-color/close.svg/" + palette.buttonText + icon.height: Style.extraSmallIconSize text: qsTr("Unshare") - onClicked: root.deleteShare() } - CustomButton { + Button { height: Style.standardPrimaryButtonHeight - - icon.source: "image://svgimage-custom-color/add.svg/" + root.accentColor - imageSourceHover: "image://svgimage-custom-color/add.svg/" + palette.brightText + icon.source: "image://svgimage-custom-color/add.svg/" + palette.buttonText + icon.height: Style.extraSmallIconSize text: qsTr("Add another link") - visible: root.isLinkShare && root.canCreateLinkShares enabled: visible - onClicked: root.createNewLinkShare() } } @@ -750,7 +753,9 @@ Page { contentWidth: (contentItem as ListView).contentWidth visible: copyShareLinkButton.visible - CustomButton { + background: Rectangle { color: "transparent" } + + Button { id: copyShareLinkButton function copyShareLink() { @@ -780,15 +785,6 @@ Page { onClicked: copyShareLink() - // TODO - // Behavior on bgColor { - // ColorAnimation { duration: Style.shortAnimationDuration } - // } - - // Behavior on bgHoverOpacity { - // NumberAnimation { duration: Style.shortAnimationDuration } - // } - Behavior on Layout.preferredWidth { SmoothedAnimation { duration: Style.shortAnimationDuration } } diff --git a/src/gui/filedetails/ShareView.qml b/src/gui/filedetails/ShareView.qml index d5c63e8d6b935..e7e6046b7f38e 100644 --- a/src/gui/filedetails/ShareView.qml +++ b/src/gui/filedetails/ShareView.qml @@ -251,12 +251,13 @@ ColumnLayout { z: Infinity sourceComponent: Rectangle { - color: palette.window + color: palette.base + radius: Style.progressBarRadius opacity: 0.5 NCBusyIndicator { anchors.centerIn: parent - color: palette.midlight + color: palette.dark } } } diff --git a/src/gui/macOS/ui/FileProviderEvictionDialog.qml b/src/gui/macOS/ui/FileProviderEvictionDialog.qml index 4d94affa725da..c62363b659315 100644 --- a/src/gui/macOS/ui/FileProviderEvictionDialog.qml +++ b/src/gui/macOS/ui/FileProviderEvictionDialog.qml @@ -31,7 +31,7 @@ ApplicationWindow { property string accountUserIdAtHost: "" title: qsTr("Evict materialised files") - color: Style.backgroundColor + color: palette.base flags: Qt.Dialog | Qt.WindowStaysOnTopHint width: 640 height: 480 @@ -52,7 +52,7 @@ ApplicationWindow { Layout.fillWidth: true } - CustomButton { + Button { padding: Style.smallSpacing text: qsTr("Reload") onClicked: reloadMaterialisedItems(accountUserIdAtHost) diff --git a/src/gui/macOS/ui/FileProviderFileDelegate.qml b/src/gui/macOS/ui/FileProviderFileDelegate.qml index 731c8f4a64f11..8bfdd034a559b 100644 --- a/src/gui/macOS/ui/FileProviderFileDelegate.qml +++ b/src/gui/macOS/ui/FileProviderFileDelegate.qml @@ -81,12 +81,12 @@ Item { EnforcedPlainTextLabel { id: fileTypeLabel text: root.fileTypeString - color: Style.ncSecondaryTextColor + color: palette.midlight } } } - CustomButton { + Button { id: deleteButton Layout.minimumWidth: implicitWidth diff --git a/src/gui/macOS/ui/FileProviderSettings.qml b/src/gui/macOS/ui/FileProviderSettings.qml index b68e71757f63d..8b11c0322021d 100644 --- a/src/gui/macOS/ui/FileProviderSettings.qml +++ b/src/gui/macOS/ui/FileProviderSettings.qml @@ -32,7 +32,7 @@ Page { title: qsTr("Virtual files settings") background: Rectangle { - color: palette.window + color: palette.base border.width: root.showBorder ? Style.normalBorderWidth : 0 border.color: root.palette.dark } @@ -74,7 +74,7 @@ Page { Rectangle { Layout.fillWidth: true height: Style.normalBorderWidth - color: Style.ncSecondaryTextColor + color: palette.midlight } FileProviderSyncStatus { @@ -149,12 +149,12 @@ Page { elide: Text.ElideRight } - CustomButton { + Button { text: qsTr("Signal file provider domain") onClicked: root.controller.signalFileProviderDomain(root.accountUserIdAtHost) } - CustomButton { + Button { text: qsTr("Create debug archive") onClicked: root.controller.createDebugArchive(root.accountUserIdAtHost) } diff --git a/src/gui/macOS/ui/FileProviderStorageInfo.qml b/src/gui/macOS/ui/FileProviderStorageInfo.qml index 3ef4d9274d3c4..107f2abe53616 100644 --- a/src/gui/macOS/ui/FileProviderStorageInfo.qml +++ b/src/gui/macOS/ui/FileProviderStorageInfo.qml @@ -48,11 +48,11 @@ GridLayout { Layout.fillWidth: true text: qsTr("%1 GB of %2 GB remote files synced").arg(root.localUsedStorage.toFixed(2)).arg(root.remoteUsedStorage.toFixed(2)); elide: Text.ElideRight - color: Style.ncSecondaryTextColor + color: palette.midlight horizontalAlignment: Text.AlignRight } - CustomButton { + Button { Layout.row: 0 Layout.column: 2 Layout.alignment: Layout.AlignRight | Layout.AlignVCenter diff --git a/src/gui/tray/ActivityActionButton.qml b/src/gui/tray/ActivityActionButton.qml deleted file mode 100644 index 36b92035c00a1..0000000000000 --- a/src/gui/tray/ActivityActionButton.qml +++ /dev/null @@ -1,54 +0,0 @@ -import QtQuick -import QtQuick.Controls -import Style -import com.nextcloud.desktopclient - -AbstractButton { - id: root - - property string toolTipText: "" - - property bool primaryButton: false - - readonly property color adjustedHeaderColor: Style.adjustedCurrentUserHeaderColor - - property string verb: "" - property bool isTalkReplyButton: false - - leftPadding: root.text === "" ? Style.smallSpacing : Style.standardSpacing - rightPadding: root.text === "" ? Style.smallSpacing : Style.standardSpacing - - contentItem: Loader { - id: contentItemLoader - active: true - sourceComponent: root.primaryButton ? primaryButtonContent : textButtonContent - } - - ToolTip { - id: customTextButtonTooltip - text: root.toolTipText - delay: Qt.styleHints.mousePressAndHoldInterval - visible: root.toolTipText !== "" && root.hovered - contentItem: EnforcedPlainTextLabel { text: customTextButtonTooltip.text } - } - - Component { - id: textButtonContent - TextButtonContents { - anchors.fill: parent - hovered: root.hovered - text: root.text - bold: root.primaryButton - } - } - - Component { - id: primaryButtonContent - NCButtonContents { - anchors.fill: parent - hovered: root.hovered - imageSource: root.icon.source - text: root.text - } - } -} diff --git a/src/gui/tray/ActivityItemActions.qml b/src/gui/tray/ActivityItemActions.qml index 0795ef3b83b6c..873da58302024 100644 --- a/src/gui/tray/ActivityItemActions.qml +++ b/src/gui/tray/ActivityItemActions.qml @@ -26,7 +26,7 @@ Repeater { model: root.linksForActionButtons - CustomButton { + Button { id: activityActionButton property string verb: model.modelData.verb diff --git a/src/gui/tray/ActivityItemContent.qml b/src/gui/tray/ActivityItemContent.qml index 7569f6e06c02e..cc56103e40194 100644 --- a/src/gui/tray/ActivityItemContent.qml +++ b/src/gui/tray/ActivityItemContent.qml @@ -124,8 +124,6 @@ RowLayout { RowLayout { Layout.fillWidth: true - spacing: Style.trayHorizontalMargin - EnforcedPlainTextLabel { id: activityTextTitle text: (root.activityData.type === "Activity" || root.activityData.type === "Notification") ? root.activityData.subject : root.activityData.message @@ -156,55 +154,56 @@ RowLayout { visible: text !== "" } - CustomButton { - id: fileDetailsButton - - Layout.preferredWidth: Style.activityListButtonWidth - Layout.preferredHeight: Style.activityListButtonHeight + Row { Layout.alignment: Qt.AlignVCenter | Qt.AlignHCenter + spacing: Style.extraSmallSpacing - icon.source: "image://svgimage-custom-color/more.svg/" + palette.buttonText - icon.width: Style.activityListButtonIconSize - icon.height: Style.activityListButtonIconSize + Button { + id: fileDetailsButton - ToolTip { - text: qsTr("Open file details") - visible: parent.hovered - } + width: Style.activityListButtonWidth + height: Style.activityListButtonHeight - display: Button.IconOnly + icon.source: "image://svgimage-custom-color/more.svg/" + palette.buttonText + icon.width: Style.activityListButtonIconSize + icon.height: Style.activityListButtonIconSize - visible: model.showFileDetails + ToolTip { + text: qsTr("Open file details") + visible: parent.hovered + } - onClicked: Systray.presentShareViewInTray(model.openablePath) - } + display: Button.IconOnly + visible: model.showFileDetails + onClicked: Systray.presentShareViewInTray(model.openablePath) + } - CustomButton { - id: dismissActionButton + Button { + id: dismissActionButton - Layout.preferredWidth: Style.activityListButtonWidth - Layout.preferredHeight: Style.activityListButtonHeight - Layout.alignment: Qt.AlignVCenter | Qt.AlignHCenter + width: Style.activityListButtonWidth + height: Style.activityListButtonHeight - icon.source: "image://svgimage-custom-color/clear.svg/" + palette.buttonText - icon.width: Style.activityListButtonIconSize - icon.height: Style.activityListButtonIconSize + icon.source: "image://svgimage-custom-color/clear.svg/" + palette.buttonText + icon.width: Style.activityListButtonIconSize + icon.height: Style.activityListButtonIconSize - display: Button.IconOnly + display: Button.IconOnly - ToolTip { - text: qsTr("Dismiss") - visible: parent.hovered - } + ToolTip { + text: qsTr("Dismiss") + visible: parent.hovered + } - onClicked: root.dismissButtonClicked() + visible: root.showDismissButton + onClicked: root.dismissButtonClicked() + } } } RowLayout { Layout.fillWidth: true Layout.fillHeight: true - spacing: Style.trayHorizontalMargin visible: activityTextInfo.visible || talkReplyMessageSent.visible || activityActions.visible EnforcedPlainTextLabel { diff --git a/src/gui/tray/CallNotificationDialog.qml b/src/gui/tray/CallNotificationDialog.qml index c2ab360273d82..22f11da71fb5e 100644 --- a/src/gui/tray/CallNotificationDialog.qml +++ b/src/gui/tray/CallNotificationDialog.qml @@ -24,7 +24,7 @@ import Qt5Compat.GraphicalEffects ApplicationWindow { id: root - color: palette.window + color: palette.base flags: Qt.Dialog | Qt.FramelessWindowHint | Qt.WindowStaysOnTopHint readonly property int windowSpacing: 10 @@ -86,7 +86,7 @@ ApplicationWindow { width: parent.width height: contentLayout.height + (root.windowSpacing * 2) radius: Systray.useNormalWindow ? 0.0 : Style.trayWindowRadius - color: Style.backgroundColor + color: palette.base border.width: Style.trayWindowBorderWidth border.color: palette.dark clip: true @@ -210,7 +210,7 @@ ApplicationWindow { id: linksRepeater model: root.links - CustomButton { + Button { id: answerCall readonly property string verb: modelData.verb readonly property bool isAnswerCallButton: verb === "WEB" @@ -219,7 +219,6 @@ ApplicationWindow { text: modelData.label icon.source: root.talkIcon + palette.brightText - imageSourceHover: root.talkIcon + palette.brightText Layout.fillWidth: true Layout.preferredHeight: Style.callNotificationPrimaryButtonMinHeight @@ -233,15 +232,13 @@ ApplicationWindow { Accessible.name: qsTr("Answer Talk call notification") Accessible.onPressAction: answerCall.clicked() } - } - CustomButton { + Button { id: declineCall text: qsTr("Decline") icon.source: root.deleteIcon + "white" - imageSourceHover: root.deleteIcon + "white" Layout.fillWidth: true Layout.preferredHeight: Style.callNotificationPrimaryButtonMinHeight diff --git a/src/gui/tray/CurrentAccountHeaderButton.qml b/src/gui/tray/CurrentAccountHeaderButton.qml new file mode 100644 index 0000000000000..44a3653d51098 --- /dev/null +++ b/src/gui/tray/CurrentAccountHeaderButton.qml @@ -0,0 +1,262 @@ +/* + * Copyright (C) 2024 by Claudio Cambra + * + * 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 QtQuick +import QtQuick.Controls +import QtQuick.Layouts + +import "../" +import "../filedetails/" + +import Style +import com.nextcloud.desktopclient + +Button { + id: root + + readonly property alias userLineInstantiator: userLineInstantiator + readonly property alias accountMenu: accountMenu + property color parentBackgroundColor: "transparent" + + display: AbstractButton.IconOnly + flat: true + + Accessible.role: Accessible.ButtonMenu + Accessible.name: qsTr("Current account") + Accessible.onPressAction: root.clicked() + + // We call open() instead of popup() because we want to position it + // exactly below the dropdown button, not the mouse + onClicked: { + syncPauseButton.text = Systray.syncIsPaused ? qsTr("Resume sync for all") : qsTr("Pause sync for all") + if (accountMenu.visible) { + accountMenu.close() + } else { + accountMenu.open() + } + } + + Menu { + id: accountMenu + + // x coordinate grows towards the right + // y coordinate grows towards the bottom + x: (root.x + 2) + y: (root.y + Style.trayWindowHeaderHeight + 2) + + width: (Style.rootWidth - 2) + height: Math.min(implicitHeight, maxMenuHeight) + closePolicy: Menu.CloseOnPressOutsideParent | Menu.CloseOnEscape + + onClosed: { + // HACK: reload account Instantiator immediately by restting it - could be done better I guess + // see also onVisibleChanged above + userLineInstantiator.active = false; + userLineInstantiator.active = true; + } + + Instantiator { + id: userLineInstantiator + model: UserModel + delegate: MenuItem { + implicitHeight: instantiatedUserLine.height + UserLine { + id: instantiatedUserLine + width: parent.width + onShowUserStatusSelector: { + userStatusDrawer.openUserStatusDrawer(model.index); + accountMenu.close(); + } + onClicked: UserModel.currentUserId = model.index; + } + } + onObjectAdded: accountMenu.insertItem(index, object) + onObjectRemoved: accountMenu.removeItem(object) + } + + MenuItem { + id: addAccountButton + hoverEnabled: true + visible: Systray.enableAddAccount + + icon.source: "image://svgimage-custom-color/add.svg/" + palette.windowText + icon.width: Style.accountAvatarSize + text: qsTr("Add account") + onClicked: UserModel.addAccount() + + Accessible.role: Accessible.MenuItem + Accessible.name: qsTr("Add new account") + Accessible.onPressAction: addAccountButton.clicked() + } + + Rectangle { + anchors.left: parent.left + anchors.right: parent.right + implicitHeight: 1 + color: palette.dark + } + + MenuItem { + id: syncPauseButton + font.pixelSize: Style.topLinePixelSize + hoverEnabled: true + onClicked: Systray.syncIsPaused = !Systray.syncIsPaused + Accessible.role: Accessible.MenuItem + Accessible.name: Systray.syncIsPaused ? qsTr("Resume sync for all") : qsTr("Pause sync for all") + Accessible.onPressAction: syncPauseButton.clicked() + } + + MenuItem { + id: settingsButton + text: qsTr("Settings") + font.pixelSize: Style.topLinePixelSize + hoverEnabled: true + onClicked: Systray.openSettings() + Accessible.role: Accessible.MenuItem + Accessible.name: text + Accessible.onPressAction: settingsButton.clicked() + } + + MenuItem { + id: exitButton + text: qsTr("Exit"); + font.pixelSize: Style.topLinePixelSize + hoverEnabled: true + onClicked: Systray.shutdown() + Accessible.role: Accessible.MenuItem + Accessible.name: text + Accessible.onPressAction: exitButton.clicked() + } + } + + RowLayout { + id: accountControlRowLayout + + height: Style.trayWindowHeaderHeight + width: Style.rootWidth + spacing: 0 + + Image { + id: currentAccountAvatar + + Layout.leftMargin: Style.trayHorizontalMargin + verticalAlignment: Qt.AlignCenter + cache: false + source: (UserModel.currentUser && UserModel.currentUser.avatar !== "") ? UserModel.currentUser.avatar : "image://avatars/fallbackWhite" + Layout.preferredHeight: Style.accountAvatarSize + Layout.preferredWidth: Style.accountAvatarSize + + Accessible.role: Accessible.Graphic + Accessible.name: qsTr("Current account avatar") + + Rectangle { + id: currentAccountStatusIndicatorBackground + visible: UserModel.currentUser && UserModel.currentUser.isConnected + && UserModel.currentUser.serverHasUserStatus + width: Style.accountAvatarStateIndicatorSize + + Style.trayFolderStatusIndicatorSizeOffset + height: width + color: root.parentBackgroundColor + anchors.bottom: currentAccountAvatar.bottom + anchors.right: currentAccountAvatar.right + radius: width * Style.trayFolderStatusIndicatorRadiusFactor + } + + Image { + id: currentAccountStatusIndicator + visible: UserModel.currentUser && UserModel.currentUser.isConnected + && UserModel.currentUser.serverHasUserStatus + source: UserModel.currentUser ? UserModel.currentUser.statusIcon : "" + cache: false + x: currentAccountStatusIndicatorBackground.x + 1 + y: currentAccountStatusIndicatorBackground.y + 1 + sourceSize.width: Style.accountAvatarStateIndicatorSize + sourceSize.height: Style.accountAvatarStateIndicatorSize + + Accessible.role: Accessible.Indicator + Accessible.name: UserModel.desktopNotificationsAllowed ? qsTr("Current account status is online") : qsTr("Current account status is do not disturb") + } + } + + Column { + id: accountLabels + spacing: 0 + Layout.alignment: Qt.AlignLeft | Qt.AlignVCenter + Layout.leftMargin: Style.userStatusSpacing + Layout.fillWidth: true + Layout.maximumWidth: parent.width + + EnforcedPlainTextLabel { + id: currentAccountUser + Layout.alignment: Qt.AlignLeft | Qt.AlignBottom + width: Style.currentAccountLabelWidth + text: UserModel.currentUser ? UserModel.currentUser.name : "" + elide: Text.ElideRight + + font.pixelSize: Style.topLinePixelSize + font.bold: true + } + + EnforcedPlainTextLabel { + id: currentAccountServer + Layout.alignment: Qt.AlignLeft | Qt.AlignBottom + width: Style.currentAccountLabelWidth + text: UserModel.currentUser ? UserModel.currentUser.server : "" + elide: Text.ElideRight + visible: UserModel.numUsers() > 1 + } + + RowLayout { + id: currentUserStatus + visible: UserModel.currentUser && UserModel.currentUser.isConnected && + UserModel.currentUser.serverHasUserStatus + spacing: Style.accountLabelsSpacing + width: parent.width + + EnforcedPlainTextLabel { + id: emoji + visible: UserModel.currentUser && UserModel.currentUser.statusEmoji !== "" + width: Style.userStatusEmojiSize + text: UserModel.currentUser ? UserModel.currentUser.statusEmoji : "" + } + EnforcedPlainTextLabel { + id: message + Layout.alignment: Qt.AlignLeft | Qt.AlignBottom + Layout.fillWidth: true + visible: UserModel.currentUser && UserModel.currentUser.statusMessage !== "" + width: Style.currentAccountLabelWidth + text: UserModel.currentUser && UserModel.currentUser.statusMessage !== "" + ? UserModel.currentUser.statusMessage + : UserModel.currentUser ? UserModel.currentUser.server : "" + elide: Text.ElideRight + font.pixelSize: Style.subLinePixelSize + } + } + } + + Loader { + active: root.indicator === null + sourceComponent: Image { + Layout.alignment: Qt.AlignRight + verticalAlignment: Qt.AlignCenter + horizontalAlignment: Qt.AlignRight + Layout.leftMargin: Style.accountDropDownCaretMargin + source: "image://svgimage-custom-color/caret-down.svg/" + palette.windowText + sourceSize.width: Style.accountDropDownCaretSize + sourceSize.height: Style.accountDropDownCaretSize + Accessible.role: Accessible.PopupMenu + Accessible.name: qsTr("Account switcher and settings menu") + } + } + } +} diff --git a/src/gui/tray/CustomButton.qml b/src/gui/tray/CustomButton.qml deleted file mode 100644 index 2ed8dc40f36d7..0000000000000 --- a/src/gui/tray/CustomButton.qml +++ /dev/null @@ -1,47 +0,0 @@ -/* - * Copyright (C) 2022 by Oleksandr Zolotov - * - * 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 QtQuick -import QtQuick.Controls -import QtQuick.Layouts -import Style - -Button { - id: root - - property string imageSourceHover: root.icon.source - property var iconItem: icon - - property string toolTipText: "" - - leftPadding: root.text === "" ? Style.smallSpacing : Style.standardSpacing - rightPadding: root.text === "" ? Style.smallSpacing : Style.standardSpacing - implicitWidth: contentItem.implicitWidth + leftPadding + rightPadding - - hoverEnabled: true - - ToolTip { - text: root.toolTipText - visible: root.toolTipText !== "" && root.hovered - } - - NCButtonContents { - id: contents - display: root.display - hovered: root.hovered - imageSource: root.icon.source - imageSourceWidth: root.icon.width - imageSourceHeight: root.icon.height - } -} diff --git a/src/gui/tray/EditFileLocallyLoadingDialog.qml b/src/gui/tray/EditFileLocallyLoadingDialog.qml index b23b0da746297..47dd20d09aa77 100644 --- a/src/gui/tray/EditFileLocallyLoadingDialog.qml +++ b/src/gui/tray/EditFileLocallyLoadingDialog.qml @@ -9,7 +9,7 @@ ApplicationWindow { id: root flags: Qt.Dialog | Qt.FramelessWindowHint | Qt.WindowStaysOnTopHint - color: palette.window + color: palette.base width: 320 height: contentLayout.implicitHeight @@ -30,7 +30,7 @@ ApplicationWindow { Rectangle { id: windowBackground - color: Style.backgroundColor + color: palette.base radius: Style.trayWindowRadius border.color: palette.dark anchors.fill: parent diff --git a/src/gui/tray/MainWindow.qml b/src/gui/tray/MainWindow.qml index be7ede737d5c5..e01729ed3da68 100644 --- a/src/gui/tray/MainWindow.qml +++ b/src/gui/tray/MainWindow.qml @@ -54,9 +54,9 @@ ApplicationWindow { onVisibleChanged: { // HACK: reload account Instantiator immediately by restting it - could be done better I guess - // see also id:accountMenu below - userLineInstantiator.active = false; - userLineInstantiator.active = true; + // see also id:trayWindowHeader.currentAccountHeaderButton.accountMenu below + trayWindowHeader.currentAccountHeaderButton.userLineInstantiator.active = false; + trayWindowHeader.currentAccountHeaderButton.userLineInstantiator.active = true; syncStatus.model.load(); } @@ -64,13 +64,13 @@ ApplicationWindow { radius: Systray.useNormalWindow ? 0.0 : Style.trayWindowRadius border.width: Style.trayWindowBorderWidth border.color: palette.dark - color: palette.window + color: palette.base } Connections { target: UserModel function onCurrentUserChanged() { - accountMenu.close(); + trayWindowHeader.currentAccountHeaderButton.accountMenu.close(); syncStatus.model.load(); } } @@ -95,8 +95,8 @@ ApplicationWindow { userStatusDrawer.close() fileDetailsDrawer.close(); - if(Systray.isOpen) { - accountMenu.close(); + if (Systray.isOpen) { + trayWindowHeader.currentAccountHeaderButton.accountMenu.close(); appsMenu.close(); openLocalFolderButton.closeMenu() } @@ -140,7 +140,7 @@ ApplicationWindow { radius: Systray.useNormalWindow ? 0.0 : Style.trayWindowRadius border.width: Style.trayWindowBorderWidth border.color: palette.dark - color: palette.window + color: palette.base } property int userIndex: 0 @@ -177,7 +177,7 @@ ApplicationWindow { radius: Systray.useNormalWindow ? 0.0 : Style.trayWindowRadius border.width: Style.trayWindowBorderWidth border.color: palette.dark - color: palette.window + color: palette.base } property var folderAccountState: ({}) @@ -212,7 +212,7 @@ ApplicationWindow { height: parent.height backgroundsVisible: false - accentColor: Style.currentUserHeaderColor + accentColor: Style.accentColor accountState: fileDetailsDrawer.folderAccountState localPath: fileDetailsDrawer.fileLocalPath showCloseButton: true @@ -237,466 +237,50 @@ ApplicationWindow { Accessible.role: Accessible.Grouping Accessible.name: qsTr("Nextcloud desktop main dialog") - Rectangle { - id: trayWindowHeaderBackground - - anchors.left: trayWindowMainItem.left - anchors.right: trayWindowMainItem.right - anchors.top: trayWindowMainItem.top - height: Style.trayWindowHeaderHeight - color: palette.window - - RowLayout { - id: trayWindowHeaderLayout - - spacing: 0 - anchors.fill: parent - - Button { - id: currentAccountButton - - Layout.preferredWidth: Style.currentAccountButtonWidth - Layout.preferredHeight: Style.trayWindowHeaderHeight - display: AbstractButton.IconOnly - flat: true - - Accessible.role: Accessible.ButtonMenu - Accessible.name: qsTr("Current account") - Accessible.onPressAction: currentAccountButton.clicked() - - // We call open() instead of popup() because we want to position it - // exactly below the dropdown button, not the mouse - onClicked: { - syncPauseButton.text = Systray.syncIsPaused ? qsTr("Resume sync for all") : qsTr("Pause sync for all") - if (accountMenu.visible) { - accountMenu.close() - } else { - accountMenu.open() - } - } - - Menu { - id: accountMenu - - // x coordinate grows towards the right - // y coordinate grows towards the bottom - x: (currentAccountButton.x + 2) - y: (currentAccountButton.y + Style.trayWindowHeaderHeight + 2) - - width: (Style.currentAccountButtonWidth - 2) - height: Math.min(implicitHeight, maxMenuHeight) - closePolicy: Menu.CloseOnPressOutsideParent | Menu.CloseOnEscape - - background: Rectangle { - border.color: palette.dark - color: palette.window - radius: Style.halfTrayWindowRadius - } - - onClosed: { - // HACK: reload account Instantiator immediately by restting it - could be done better I guess - // see also onVisibleChanged above - userLineInstantiator.active = false; - userLineInstantiator.active = true; - } - - Instantiator { - id: userLineInstantiator - model: UserModel - delegate: UserLine { - onShowUserStatusSelector: { - userStatusDrawer.openUserStatusDrawer(model.index); - accountMenu.close(); - } - onClicked: UserModel.currentUserId = model.index; - } - onObjectAdded: accountMenu.insertItem(index, object) - onObjectRemoved: accountMenu.removeItem(object) - } - - MenuItem { - id: addAccountButton - height: Systray.enableAddAccount ? Style.addAccountButtonHeight : 0 - hoverEnabled: true - visible: Systray.enableAddAccount - - RowLayout { - anchors.fill: parent - spacing: 0 - - Image { - Layout.leftMargin: Style.accountIconsMenuMargin - verticalAlignment: Qt.AlignVCenter - horizontalAlignment: Qt.AlignCenter - source: "image://svgimage-custom-color/add.svg/" + palette.windowText - sourceSize.width: Style.addButtonIconSize - sourceSize.height: Style.addButtonIconSize - } - EnforcedPlainTextLabel { - Layout.leftMargin: 14 - text: qsTr("Add account") - font.pixelSize: Style.topLinePixelSize - } - // Filler on the right - Item { - Layout.fillWidth: true - Layout.fillHeight: true - } - } - onClicked: UserModel.addAccount() - - Accessible.role: Accessible.MenuItem - Accessible.name: qsTr("Add new account") - Accessible.onPressAction: addAccountButton.clicked() - - background: Rectangle { - radius: Style.halfTrayWindowRadius - color: palette.highlight - visible: addAccountButton.hovered - } - } - - Rectangle { - anchors.left: parent.left - anchors.right: parent.right - implicitHeight: 1 - color: palette.dark - } - - MenuItem { - id: syncPauseButton - font.pixelSize: Style.topLinePixelSize - hoverEnabled: true - onClicked: Systray.syncIsPaused = !Systray.syncIsPaused - Accessible.role: Accessible.MenuItem - Accessible.name: Systray.syncIsPaused ? qsTr("Resume sync for all") : qsTr("Pause sync for all") - Accessible.onPressAction: syncPauseButton.clicked() - - background: Rectangle { - radius: Style.halfTrayWindowRadius - color: palette.highlight - visible: syncPauseButton.hovered - } - } - - MenuItem { - id: settingsButton - text: qsTr("Settings") - font.pixelSize: Style.topLinePixelSize - hoverEnabled: true - onClicked: Systray.openSettings() - Accessible.role: Accessible.MenuItem - Accessible.name: text - Accessible.onPressAction: settingsButton.clicked() - - background: Rectangle { - radius: Style.halfTrayWindowRadius - color: palette.highlight - visible: settingsButton.hovered - } - } - - MenuItem { - id: exitButton - text: qsTr("Exit"); - font.pixelSize: Style.topLinePixelSize - hoverEnabled: true - onClicked: Systray.shutdown() - Accessible.role: Accessible.MenuItem - Accessible.name: text - Accessible.onPressAction: exitButton.clicked() - - background: Rectangle { - radius: Style.halfTrayWindowRadius - color: palette.highlight - visible: exitButton.hovered - } - } - } - - RowLayout { - id: accountControlRowLayout - - height: Style.trayWindowHeaderHeight - width: Style.currentAccountButtonWidth - spacing: 0 - - Image { - id: currentAccountAvatar - - Layout.leftMargin: Style.trayHorizontalMargin - verticalAlignment: Qt.AlignCenter - cache: false - source: (UserModel.currentUser && UserModel.currentUser.avatar !== "") ? UserModel.currentUser.avatar : "image://avatars/fallbackWhite" - Layout.preferredHeight: Style.accountAvatarSize - Layout.preferredWidth: Style.accountAvatarSize - - Accessible.role: Accessible.Graphic - Accessible.name: qsTr("Current account avatar") - - Rectangle { - id: currentAccountStatusIndicatorBackground - visible: UserModel.currentUser && UserModel.currentUser.isConnected - && UserModel.currentUser.serverHasUserStatus - width: Style.accountAvatarStateIndicatorSize + + Style.trayFolderStatusIndicatorSizeOffset - height: width - anchors.bottom: currentAccountAvatar.bottom - anchors.right: currentAccountAvatar.right - radius: width * Style.trayFolderStatusIndicatorRadiusFactor - } - - // TODO: check if we want add any hover effect - // Rectangle { - // id: currentAccountStatusIndicatorMouseHover - // visible: UserModel.currentUser && UserModel.currentUser.isConnected - // && UserModel.currentUser.serverHasUserStatus - // width: Style.accountAvatarStateIndicatorSize + + Style.trayFolderStatusIndicatorSizeOffset - // height: width - // anchors.bottom: currentAccountAvatar.bottom - // anchors.right: currentAccountAvatar.right - // color: currentAccountButton.hovered ? palette.highlight : palette.window - // opacity: Style.trayFolderStatusIndicatorMouseHoverOpacityFactor - // radius: width * Style.trayFolderStatusIndicatorRadiusFactor - // } - - Image { - id: currentAccountStatusIndicator - visible: UserModel.currentUser && UserModel.currentUser.isConnected - && UserModel.currentUser.serverHasUserStatus - source: UserModel.currentUser ? UserModel.currentUser.statusIcon : "" - cache: false - x: currentAccountStatusIndicatorBackground.x + 1 - y: currentAccountStatusIndicatorBackground.y + 1 - sourceSize.width: Style.accountAvatarStateIndicatorSize - sourceSize.height: Style.accountAvatarStateIndicatorSize - - Accessible.role: Accessible.Indicator - Accessible.name: UserModel.desktopNotificationsAllowed ? qsTr("Current account status is online") : qsTr("Current account status is do not disturb") - } - } - - Column { - id: accountLabels - spacing: 0 - Layout.alignment: Qt.AlignLeft | Qt.AlignVCenter - Layout.leftMargin: Style.userStatusSpacing - Layout.fillWidth: true - Layout.maximumWidth: parent.width - - EnforcedPlainTextLabel { - id: currentAccountUser - Layout.alignment: Qt.AlignLeft | Qt.AlignBottom - width: Style.currentAccountLabelWidth - text: UserModel.currentUser ? UserModel.currentUser.name : "" - elide: Text.ElideRight - - font.pixelSize: Style.topLinePixelSize - font.bold: true - } - - EnforcedPlainTextLabel { - id: currentAccountServer - Layout.alignment: Qt.AlignLeft | Qt.AlignBottom - width: Style.currentAccountLabelWidth - text: UserModel.currentUser ? UserModel.currentUser.server : "" - elide: Text.ElideRight - visible: UserModel.numUsers() > 1 - } - - RowLayout { - id: currentUserStatus - visible: UserModel.currentUser && UserModel.currentUser.isConnected && - UserModel.currentUser.serverHasUserStatus - spacing: Style.accountLabelsSpacing - width: parent.width - - EnforcedPlainTextLabel { - id: emoji - visible: UserModel.currentUser && UserModel.currentUser.statusEmoji !== "" - width: Style.userStatusEmojiSize - text: UserModel.currentUser ? UserModel.currentUser.statusEmoji : "" - } - EnforcedPlainTextLabel { - id: message - Layout.alignment: Qt.AlignLeft | Qt.AlignBottom - Layout.fillWidth: true - visible: UserModel.currentUser && UserModel.currentUser.statusMessage !== "" - width: Style.currentAccountLabelWidth - text: UserModel.currentUser && UserModel.currentUser.statusMessage !== "" - ? UserModel.currentUser.statusMessage - : UserModel.currentUser ? UserModel.currentUser.server : "" - elide: Text.ElideRight - font.pixelSize: Style.subLinePixelSize - } - } - } - - Image { - Layout.alignment: Qt.AlignRight - verticalAlignment: Qt.AlignCenter - horizontalAlignment: Qt.AlignRight - Layout.leftMargin: Style.accountDropDownCaretMargin - source: "image://svgimage-custom-color/caret-down.svg/" + palette.windowText - sourceSize.width: Style.accountDropDownCaretSize - sourceSize.height: Style.accountDropDownCaretSize - Accessible.role: Accessible.PopupMenu - Accessible.name: qsTr("Account switcher and settings menu") - } - } - } - - // Add space between items - Item { - Layout.fillWidth: true - } - - TrayFoldersMenuButton { - id: openLocalFolderButton - - visible: currentUser.hasLocalFolder - currentUser: UserModel.currentUser - - onClicked: openLocalFolderButton.userHasGroupFolders ? openLocalFolderButton.toggleMenuOpen() : UserModel.openCurrentAccountLocalFolder() + TrayWindowHeader { + id: trayWindowHeader - onFolderEntryTriggered: isGroupFolder ? UserModel.openCurrentAccountFolderFromTrayInfo(fullFolderPath) : UserModel.openCurrentAccountLocalFolder() - - Accessible.role: Accessible.Graphic - Accessible.name: qsTr("Open local or group folders") - Accessible.onPressAction: openLocalFolderButton.userHasGroupFolders ? openLocalFolderButton.toggleMenuOpen() : UserModel.openCurrentAccountLocalFolder() - - Layout.alignment: Qt.AlignRight - Layout.preferredWidth: Style.trayWindowHeaderHeight - Layout.preferredHeight: Style.trayWindowHeaderHeight - } - - HeaderButton { - id: trayWindowFeaturedAppButton - visible: UserModel.currentUser.isFeaturedAppEnabled - icon.source: UserModel.currentUser.featuredAppIcon + "/" - onClicked: UserModel.openCurrentAccountFeaturedApp() - - Accessible.role: Accessible.Button - Accessible.name: UserModel.currentUser.featuredAppAccessibleName - Accessible.onPressAction: trayWindowFeaturedAppButton.clicked() - - Layout.alignment: Qt.AlignRight - Layout.preferredWidth: Style.trayWindowHeaderHeight - Layout.preferredHeight: Style.trayWindowHeaderHeight - } - - HeaderButton { - id: trayWindowAppsButton - icon.source: "image://svgimage-custom-color/more-apps.svg/" + palette.windowText - - onClicked: { - if(appsMenuListView.count <= 0) { - UserModel.openCurrentAccountServer() - } else if (appsMenu.visible) { - appsMenu.close() - } else { - appsMenu.open() - } - } - - Accessible.role: Accessible.ButtonMenu - Accessible.name: qsTr("More apps") - Accessible.onPressAction: trayWindowAppsButton.clicked() - - Menu { - id: appsMenu - x: Style.trayWindowMenuOffsetX - y: (trayWindowAppsButton.y + trayWindowAppsButton.height + Style.trayWindowMenuOffsetY) - width: Style.trayWindowWidth * Style.trayWindowMenuWidthFactor - height: implicitHeight + y > Style.trayWindowHeight ? Style.trayWindowHeight - y : implicitHeight - closePolicy: Menu.CloseOnPressOutsideParent | Menu.CloseOnEscape - - background: Rectangle { - border.color: palette.dark - radius: Style.halfTrayWindowRadius - color: palette.window - } - - contentItem: ScrollView { - id: appsMenuScrollView - ScrollBar.horizontal.policy: ScrollBar.AlwaysOff - - data: WheelHandler { - target: appsMenuScrollView.contentItem - } - ListView { - id: appsMenuListView - implicitHeight: contentHeight - model: UserAppsModel - interactive: true - clip: true - currentIndex: appsMenu.currentIndex - delegate: MenuItem { - id: appEntry - anchors.left: parent.left - anchors.right: parent.right - text: model.appName - font.pixelSize: Style.topLinePixelSize - icon.source: model.appIconUrl - icon.color: palette.windowText - onTriggered: UserAppsModel.openAppUrl(appUrl) - hoverEnabled: true - Accessible.role: Accessible.MenuItem - Accessible.name: qsTr("Open %1 in browser").arg(model.appName) - Accessible.onPressAction: appEntry.triggered() - - background: Rectangle { - anchors.fill: parent - anchors.margins: 1 - color: appEntry.hovered ? palette.highlight : palette.window - radius: Style.halfTrayWindowRadius - } - } - } - } - } - } - } - } // Rectangle trayWindowHeaderBackground + anchors.top: parent.top + anchors.left: parent.left + anchors.right: parent.right + height: Style.trayWindowHeaderHeight + } UnifiedSearchInputContainer { id: trayWindowUnifiedSearchInputContainer - height: Math.max(Style.talkReplyTextFieldPreferredHeight, contentHeight) - anchors { - top: trayWindowHeaderBackground.bottom - left: trayWindowMainItem.left - right: trayWindowMainItem.right - - topMargin: Style.trayHorizontalMargin + controlRoot.padding - leftMargin: Style.trayHorizontalMargin + controlRoot.padding - rightMargin: Style.trayHorizontalMargin + controlRoot.padding - } + anchors.top: trayWindowHeader.bottom + anchors.left: trayWindowMainItem.left + anchors.right: trayWindowMainItem.right + anchors.topMargin: Style.trayHorizontalMargin + anchors.leftMargin: Style.trayHorizontalMargin + anchors.rightMargin: Style.trayHorizontalMargin text: UserModel.currentUser.unifiedSearchResultsListModel.searchTerm readOnly: !UserModel.currentUser.isConnected || UserModel.currentUser.unifiedSearchResultsListModel.currentFetchMoreInProgressProviderId isSearchInProgress: UserModel.currentUser.unifiedSearchResultsListModel.isSearchInProgress onTextEdited: { UserModel.currentUser.unifiedSearchResultsListModel.searchTerm = trayWindowUnifiedSearchInputContainer.text } onClearText: { UserModel.currentUser.unifiedSearchResultsListModel.searchTerm = "" } + } - // TODO: consult designers, this line looks weird atm - // Rectangle { - // id: bottomUnifiedSearchInputSeparator + Rectangle { + id: bottomUnifiedSearchInputSeparator - // anchors.left: parent.left - // anchors.right: parent.right - // anchors.bottom: parent.bottom + anchors.top: trayWindowUnifiedSearchInputContainer.bottom + anchors.left: parent.left + anchors.right: parent.right + anchors.topMargin: Style.trayHorizontalMargin - // height: 1 - // color: Style.menuBorder - // visible: trayWindowMainItem.isUnifiedSearchActive - // } + height: 1 + color: palette.dark + visible: trayWindowMainItem.isUnifiedSearchActive } ErrorBox { id: unifiedSearchResultsErrorLabel visible: UserModel.currentUser.unifiedSearchResultsListModel.errorString && !unifiedSearchResultsListView.visible && ! UserModel.currentUser.unifiedSearchResultsListModel.isSearchInProgress && ! UserModel.currentUser.unifiedSearchResultsListModel.currentFetchMoreInProgressProviderId text: UserModel.currentUser.unifiedSearchResultsListModel.errorString - anchors.top: trayWindowUnifiedSearchInputContainer.bottom + anchors.top: bottomUnifiedSearchInputSeparator.bottom anchors.left: trayWindowMainItem.left anchors.right: trayWindowMainItem.right anchors.margins: Style.trayHorizontalMargin @@ -705,7 +289,7 @@ ApplicationWindow { UnifiedSearchResultNothingFound { id: unifiedSearchResultNothingFound - anchors.top: trayWindowUnifiedSearchInputContainer.bottom + anchors.top: bottomUnifiedSearchInputSeparator.bottom anchors.left: trayWindowMainItem.left anchors.right: trayWindowMainItem.right anchors.topMargin: Style.trayHorizontalMargin @@ -723,7 +307,7 @@ ApplicationWindow { Loader { id: unifiedSearchResultsListViewSkeletonLoader - anchors.top: trayWindowUnifiedSearchInputContainer.bottom + anchors.top: bottomUnifiedSearchInputSeparator.bottom anchors.left: trayWindowMainItem.left anchors.right: trayWindowMainItem.right anchors.bottom: trayWindowMainItem.bottom @@ -752,7 +336,7 @@ ApplicationWindow { } visible: unifiedSearchResultsListView.count > 0 - anchors.top: trayWindowUnifiedSearchInputContainer.bottom + anchors.top: bottomUnifiedSearchInputSeparator.bottom anchors.left: trayWindowMainItem.left anchors.right: trayWindowMainItem.right anchors.bottom: trayWindowMainItem.bottom @@ -792,21 +376,22 @@ ApplicationWindow { SyncStatus { id: syncStatus + accentColor: Style.accentColor visible: !trayWindowMainItem.isUnifiedSearchActive anchors.top: trayWindowUnifiedSearchInputContainer.bottom anchors.left: trayWindowMainItem.left anchors.right: trayWindowMainItem.right + } - Rectangle { - id: syncStatusSeparator - - Layout.fillWidth: true - Layout.preferredHeight: 1 - - height: 1 - color: Style.menuBorder - } + Rectangle { + id: syncStatusSeparator + anchors.left: syncStatus.left + anchors.right: syncStatus.right + anchors.bottom: syncStatus.bottom + height: 1 + color: palette.dark + visible: !trayWindowMainItem.isUnifiedSearchActive } Loader { @@ -823,7 +408,7 @@ ApplicationWindow { active: false - sourceComponent: CustomButton { + sourceComponent: Button { id: newActivitiesButton hoverEnabled: true padding: Style.smallSpacing @@ -851,9 +436,9 @@ ApplicationWindow { OpacityAnimator { id: fadeoutActivitiesButtonDisappear - target: newActivitiesButton; - from: 1; - to: 0; + target: newActivitiesButton + from: 1 + to: 0 duration: Style.newActivityButtonDisappearFadeTimeout loops: 1 running: false diff --git a/src/gui/tray/NCButtonBackground.qml b/src/gui/tray/NCButtonBackground.qml deleted file mode 100644 index cc9d286e8aaa9..0000000000000 --- a/src/gui/tray/NCButtonBackground.qml +++ /dev/null @@ -1,29 +0,0 @@ -/* - * Copyright (C) by Claudio Cambra - * - * 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 QtQuick - -import Style - -Rectangle { - property bool hovered: false - property real normalOpacity: 0.3 - property real hoverOpacity: 1.0 - property color normalColor: palette.button - property color hoverColor: palette.button - - color: hovered ? hoverColor : normalColor - opacity: hovered ? hoverOpacity : normalOpacity - radius: width / 2 -} diff --git a/src/gui/tray/NCButtonContents.qml b/src/gui/tray/NCButtonContents.qml deleted file mode 100644 index e0053d850436a..0000000000000 --- a/src/gui/tray/NCButtonContents.qml +++ /dev/null @@ -1,67 +0,0 @@ -/* - * Copyright (C) by Claudio Cambra - * - * 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 QtQuick -import QtQuick.Controls -import QtQuick.Layouts - -import Style - -RowLayout { - id: root - - property bool hovered: false - property string imageSource: "" - property int imageSourceWidth: undefined - property int imageSourceHeight: undefined - property string text: "" - property var display - - property alias font: buttonLabel.font - - Image { - id: icon - - Layout.maximumWidth: root.height - Layout.maximumHeight: root.height - Layout.alignment: Qt.AlignCenter - - source: root.imageSource - - sourceSize { - width: root.imageSourceWidth - height: root.imageSourceHeight - } - - fillMode: Image.PreserveAspectFit - horizontalAlignment: Image.AlignHCenter - verticalAlignment: Image.AlignVCenter - visible: root.display === Button.TextOnly ? false : root.hovered ? root.imageSourceHover !== "" : root.imageSource !== "" - } - - EnforcedPlainTextLabel { - id: buttonLabel - - Layout.fillWidth: true - - text: root.text - - visible: root.text !== "" - - horizontalAlignment: icon.visible ? Text.AlignLeft : Text.AlignHCenter - verticalAlignment: Text.AlignVCenter - - elide: Text.ElideRight - } -} diff --git a/src/gui/tray/NCProgressBar.qml b/src/gui/tray/NCProgressBar.qml index c620f149a2ff5..b86d0faf30660 100644 --- a/src/gui/tray/NCProgressBar.qml +++ b/src/gui/tray/NCProgressBar.qml @@ -16,15 +16,18 @@ import QtQuick import QtQuick.Controls import Style +// TODO: the current style does not support customization of this control ProgressBar { id: control + property color fillColor: Style.ncBlue + background: Rectangle { implicitWidth: Style.progressBarWidth implicitHeight: Style.progressBarBackgroundHeight radius: Style.progressBarRadius - color: Style.progressBarBackgroundColor - border.color: Style.progressBarBackgroundBorderColor + color: palette.base + border.color: palette.dark border.width: Style.progressBarBackgroundBorderWidth } @@ -36,8 +39,8 @@ ProgressBar { width: control.visualPosition * parent.width height: parent.height radius: Style.progressBarRadius - color: Style.progressBarContentColor - border.color: Style.progressBarContentBorderColor + color: control.fillColor + border.color: palette.dark border.width: Style.progressBarContentBorderWidth } } diff --git a/src/gui/tray/SyncStatus.qml b/src/gui/tray/SyncStatus.qml index e8bb975189663..b482c5586dab7 100644 --- a/src/gui/tray/SyncStatus.qml +++ b/src/gui/tray/SyncStatus.qml @@ -10,6 +10,7 @@ RowLayout { id: root property alias model: syncStatus + property color accentColor: Style.ncBlue spacing: Style.trayHorizontalMargin @@ -26,9 +27,9 @@ RowLayout { Layout.preferredHeight: size Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter - Layout.topMargin: 16 + Layout.topMargin: Style.trayHorizontalMargin Layout.rightMargin: whiteSpace * (0.5 + Style.thumbnailImageSizeReduction) - Layout.bottomMargin: 16 + Layout.bottomMargin: Style.trayHorizontalMargin Layout.leftMargin: Style.trayHorizontalMargin + (whiteSpace * (0.5 - Style.thumbnailImageSizeReduction)) padding: 0 @@ -69,6 +70,7 @@ RowLayout { sourceComponent: NCProgressBar { id: syncProgressBar value: syncStatus.syncProgress + fillColor: root.accentColor } } @@ -84,13 +86,9 @@ RowLayout { } } - CustomButton { + Button { id: syncNowButton - FontMetrics { - id: syncNowFm - } - Layout.rightMargin: Style.trayHorizontalMargin text: qsTr("Sync now") @@ -109,11 +107,7 @@ RowLayout { } } - CustomButton { - Layout.preferredWidth: syncNowFm.boundingRect(text).width + - leftPadding + - rightPadding + - Style.standardSpacing * 2 + Button { Layout.rightMargin: Style.trayHorizontalMargin text: qsTr("Resolve conflicts") diff --git a/src/gui/tray/TalkReplyTextField.qml b/src/gui/tray/TalkReplyTextField.qml index 9e67629af95b3..40447957228ef 100644 --- a/src/gui/tray/TalkReplyTextField.qml +++ b/src/gui/tray/TalkReplyTextField.qml @@ -21,7 +21,7 @@ TextField { background: Rectangle { border.color: palette.dark radius: Style.trayWindowRadius - color: palette.window + color: palette.base } Button { diff --git a/src/gui/tray/TextButtonContents.qml b/src/gui/tray/TextButtonContents.qml deleted file mode 100644 index 0d49e63ba96e0..0000000000000 --- a/src/gui/tray/TextButtonContents.qml +++ /dev/null @@ -1,33 +0,0 @@ -/* - * Copyright (C) by Claudio Cambra - * - * 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 QtQuick -import QtQuick.Controls -import QtQuick.Layouts - -import Style - -EnforcedPlainTextLabel { - property bool hovered: false - property bool bold: false - - font.underline: true - font.bold: bold - - horizontalAlignment: Text.AlignLeft - verticalAlignment: Text.AlignVCenter - - elide: Text.ElideRight -} - diff --git a/src/gui/tray/TrayFolderListItem.qml b/src/gui/tray/TrayFolderListItem.qml index 13cc5fa0ec05f..720a311aa3a86 100644 --- a/src/gui/tray/TrayFolderListItem.qml +++ b/src/gui/tray/TrayFolderListItem.qml @@ -30,17 +30,6 @@ MenuItem { text: root.toolTipText } - background: Item { - height: parent.height - width: parent.width - Rectangle { - anchors.fill: parent - anchors.margins: Style.normalBorderWidth - color: parent.parent.hovered || parent.parent.visualFocus ? palette.highlight : palette.window - radius: Style.halfTrayWindowRadius - } - } - contentItem: RowLayout { anchors.fill: parent anchors.leftMargin: Style.trayWindowMenuEntriesMargin diff --git a/src/gui/tray/TrayFoldersMenuButton.qml b/src/gui/tray/TrayFoldersMenuButton.qml index 020f6398acffe..85fa37d098ede 100644 --- a/src/gui/tray/TrayFoldersMenuButton.qml +++ b/src/gui/tray/TrayFoldersMenuButton.qml @@ -26,6 +26,7 @@ HeaderButton { required property var currentUser property bool userHasGroupFolders: currentUser.groupFolders.length > 0 + property color parentBackgroundColor: "transparent" function openMenu() { foldersMenuLoader.openMenu() @@ -90,18 +91,9 @@ HeaderButton { id: folderStateIndicatorBackground width: Style.folderStateIndicatorSize + Style.trayFolderStatusIndicatorSizeOffset height: width + color: root.parentBackgroundColor anchors.centerIn: parent radius: width * Style.trayFolderStatusIndicatorRadiusFactor - z: -2 - } - - Rectangle { - id: folderStateIndicatorBackgroundMouseHover - width: Style.folderStateIndicatorSize + Style.trayFolderStatusIndicatorSizeOffset - height: width - anchors.centerIn: parent - opacity: Style.trayFolderStatusIndicatorMouseHoverOpacityFactor - radius: width * Style.trayFolderStatusIndicatorRadiusFactor z: -1 } } @@ -178,12 +170,6 @@ HeaderButton { height: implicitHeight + y > Style.trayWindowHeight ? Style.trayWindowHeight - y : implicitHeight closePolicy: Menu.CloseOnPressOutsideParent | Menu.CloseOnEscape - background: Rectangle { - border.color: palette.dark - color: palette.window - radius: Style.trayWindowRadius - } - contentItem: ScrollView { id: foldersMenuScrollView diff --git a/src/gui/tray/TrayWindowHeader.qml b/src/gui/tray/TrayWindowHeader.qml new file mode 100644 index 0000000000000..142a77eee63bf --- /dev/null +++ b/src/gui/tray/TrayWindowHeader.qml @@ -0,0 +1,138 @@ +/* + * Copyright (C) 2020 by Dominique Fuchs <32204802+DominiqueFuchs@users.noreply.github.com> + * + * 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 QtQuick +import QtQuick.Controls +import QtQuick.Layouts + +import "../" +import "../filedetails/" + +import Style +import com.nextcloud.desktopclient + +Rectangle { + id: root + + readonly property alias currentAccountHeaderButton: currentAccountHeaderButton + + color: Style.currentUserHeaderColor + + palette { + text: Style.currentUserHeaderTextColor + windowText: Style.currentUserHeaderTextColor + buttonText: Style.currentUserHeaderTextColor + } + + RowLayout { + id: trayWindowHeaderLayout + + spacing: 0 + anchors.fill: parent + + CurrentAccountHeaderButton { + id: currentAccountHeaderButton + parentBackgroundColor: root.color + Layout.preferredWidth: Style.currentAccountButtonWidth + Layout.fillHeight: true + } + + // Add space between items + Item { + Layout.fillWidth: true + } + + TrayFoldersMenuButton { + id: openLocalFolderButton + + Layout.alignment: Qt.AlignRight + Layout.preferredWidth: Style.trayWindowHeaderHeight + Layout.fillHeight: true + + visible: currentUser.hasLocalFolder + currentUser: UserModel.currentUser + parentBackgroundColor: root.color + + onClicked: openLocalFolderButton.userHasGroupFolders ? openLocalFolderButton.toggleMenuOpen() : UserModel.openCurrentAccountLocalFolder() + + onFolderEntryTriggered: isGroupFolder ? UserModel.openCurrentAccountFolderFromTrayInfo(fullFolderPath) : UserModel.openCurrentAccountLocalFolder() + + Accessible.role: Accessible.Graphic + Accessible.name: qsTr("Open local or group folders") + Accessible.onPressAction: openLocalFolderButton.userHasGroupFolders ? openLocalFolderButton.toggleMenuOpen() : UserModel.openCurrentAccountLocalFolder() + } + + HeaderButton { + id: trayWindowFeaturedAppButton + + Layout.alignment: Qt.AlignRight + Layout.preferredWidth: Style.trayWindowHeaderHeight + Layout.fillHeight: true + + visible: UserModel.currentUser.isFeaturedAppEnabled + icon.source: UserModel.currentUser.featuredAppIcon + "/" + onClicked: UserModel.openCurrentAccountFeaturedApp() + + Accessible.role: Accessible.Button + Accessible.name: UserModel.currentUser.featuredAppAccessibleName + Accessible.onPressAction: trayWindowFeaturedAppButton.clicked() + } + + HeaderButton { + id: trayWindowAppsButton + icon.source: "image://svgimage-custom-color/more-apps.svg/" + palette.windowText + + onClicked: { + if(appsMenu.count <= 0) { + UserModel.openCurrentAccountServer() + } else if (appsMenu.visible) { + appsMenu.close() + } else { + appsMenu.open() + } + } + + Accessible.role: Accessible.ButtonMenu + Accessible.name: qsTr("More apps") + Accessible.onPressAction: trayWindowAppsButton.clicked() + + Menu { + id: appsMenu + x: Style.trayWindowMenuOffsetX + y: (trayWindowAppsButton.y + trayWindowAppsButton.height + Style.trayWindowMenuOffsetY) + width: Style.trayWindowWidth * Style.trayWindowMenuWidthFactor + height: implicitHeight + y > Style.trayWindowHeight ? Style.trayWindowHeight - y : implicitHeight + closePolicy: Menu.CloseOnPressOutsideParent | Menu.CloseOnEscape + + Repeater { + model: UserAppsModel + delegate: MenuItem { + id: appEntry + anchors.left: parent.left + anchors.right: parent.right + text: model.appName + font.pixelSize: Style.topLinePixelSize + icon.source: model.appIconUrl + icon.color: palette.windowText + onTriggered: UserAppsModel.openAppUrl(appUrl) + hoverEnabled: true + Accessible.role: Accessible.MenuItem + Accessible.name: qsTr("Open %1 in browser").arg(model.appName) + Accessible.onPressAction: appEntry.triggered() + } + } + } + } + } +} diff --git a/src/gui/tray/UnifiedSearchInputContainer.qml b/src/gui/tray/UnifiedSearchInputContainer.qml index b1c11b8f2b557..186d344815de7 100644 --- a/src/gui/tray/UnifiedSearchInputContainer.qml +++ b/src/gui/tray/UnifiedSearchInputContainer.qml @@ -21,98 +21,85 @@ import Style import com.nextcloud.desktopclient TextField { - id: trayWindowUnifiedSearchTextField + id: root + + signal clearText() property bool isSearchInProgress: false readonly property color textFieldIconsColor: palette.dark - readonly property color placeholderColor: palette.dark - readonly property int textFieldIconsOffset: Style.trayHorizontalMargin - - readonly property double textFieldIconsScaleFactor: 0.6 - - readonly property int textFieldHorizontalPaddingOffset: Style.trayHorizontalMargin + readonly property int iconInset: Style.smallSpacing - signal clearText() - - leftPadding: trayWindowUnifiedSearchTextFieldSearchIcon.width + trayWindowUnifiedSearchTextFieldSearchIcon.anchors.leftMargin + textFieldHorizontalPaddingOffset - 1 - rightPadding: trayWindowUnifiedSearchTextFieldClearTextButton.width + trayWindowUnifiedSearchTextFieldClearTextButton.anchors.rightMargin + textFieldHorizontalPaddingOffset + topPadding: topInset + bottomPadding: bottomInset + leftPadding: searchIconImage.width + searchIconImage.x + Style.smallSpacing + rightPadding: (width - clearTextButton.x) + Style.smallSpacing + verticalAlignment: Qt.AlignVCenter placeholderText: qsTr("Search files, messages, events …") - verticalAlignment: Qt.AlignVCenter selectByMouse: true - background: Rectangle { - border.color: palette.dark - radius: Style.trayWindowRadius - color: palette.window - } - Image { - id: trayWindowUnifiedSearchTextFieldSearchIcon - width: Style.trayListItemIconSize - anchors.leftMargin - fillMode: Image.PreserveAspectFit - horizontalAlignment: Image.AlignLeft + id: searchIconImage anchors { - left: parent.left - leftMargin: parent.textFieldIconsOffset - verticalCenter: parent.verticalCenter + left: root.left + leftMargin: iconInset + top: root.top + topMargin: Style.extraSmallSpacing + bottom: root.bottom + bottomMargin: Style.extraSmallSpacing } - visible: !trayWindowUnifiedSearchTextField.isSearchInProgress - - smooth: true; + fillMode: Image.PreserveAspectFit + smooth: true antialiasing: true mipmap: true - source: "image://svgimage-custom-color/search.svg" + "/" + trayWindowUnifiedSearchTextField.textFieldIconsColor - sourceSize: Qt.size(parent.height * parent.textFieldIconsScaleFactor, parent.height * parent.textFieldIconsScaleFactor) + source: "image://svgimage-custom-color/search.svg" + "/" + root.textFieldIconsColor + visible: !root.isSearchInProgress } NCBusyIndicator { id: busyIndicator anchors { - left: trayWindowUnifiedSearchTextField.left - bottom: trayWindowUnifiedSearchTextField.bottom - leftMargin: trayWindowUnifiedSearchTextField.textFieldIconsOffset - 4 - topMargin: Style.smallSpacing - bottomMargin: Style.smallSpacing - verticalCenter: trayWindowUnifiedSearchTextField.verticalCenter + top: root.top + topMargin: Style.extraSmallSpacing + bottom: root.bottom + bottomMargin: Style.extraSmallSpacing + left: root.left + leftMargin: iconInset } width: height - color: trayWindowUnifiedSearchTextField.textFieldIconsColor - visible: trayWindowUnifiedSearchTextField.isSearchInProgress + color: root.textFieldIconsColor + visible: root.isSearchInProgress running: visible } Image { - id: trayWindowUnifiedSearchTextFieldClearTextButton + id: clearTextButton anchors { - right: parent.right - rightMargin: parent.textFieldIconsOffset - verticalCenter: parent.verticalCenter + top: root.top + topMargin: Style.extraSmallSpacing + bottom: root.bottom + bottomMargin: Style.extraSmallSpacing + right: root.right + rightMargin: iconInset } - smooth: true; - antialiasing: true - mipmap: true - - visible: parent.text - source: "image://svgimage-custom-color/clear.svg" + "/" + trayWindowUnifiedSearchTextField.textFieldIconsColor - sourceSize: Qt.size(parent.height * parent.textFieldIconsScaleFactor, parent.height * parent.textFieldIconsScaleFactor) + fillMode: Image.PreserveAspectFit + visible: root.text + source: "image://svgimage-custom-color/clear.svg" + "/" + root.textFieldIconsColor MouseArea { - id: trayWindowUnifiedSearchTextFieldClearTextButtonMouseArea - + id: clearTextButtonMouseArea anchors.fill: parent - - onClicked: trayWindowUnifiedSearchTextField.clearText() + onClicked: root.clearText() } } } diff --git a/src/gui/tray/UnifiedSearchResultListItem.qml b/src/gui/tray/UnifiedSearchResultListItem.qml index a69855c53ae23..bc3588e6e527f 100644 --- a/src/gui/tray/UnifiedSearchResultListItem.qml +++ b/src/gui/tray/UnifiedSearchResultListItem.qml @@ -46,7 +46,7 @@ MouseArea { Rectangle { id: unifiedSearchResultHoverBackground anchors.fill: parent - color: parent.containsMouse ? palette.highlight : palette.window + color: parent.containsMouse ? palette.highlight : "transparent" } Loader { diff --git a/src/gui/tray/UserLine.qml b/src/gui/tray/UserLine.qml index e6f5ef800c218..6502817e9f135 100644 --- a/src/gui/tray/UserLine.qml +++ b/src/gui/tray/UserLine.qml @@ -26,26 +26,15 @@ AbstractButton { signal showUserStatusSelector(int id) - property variant dialog; - property variant comp; Accessible.role: Accessible.MenuItem Accessible.name: qsTr("Switch to account") + " " + model.name height: Style.trayWindowHeaderHeight - background: Rectangle { - anchors.fill: parent - anchors.margins: 1 - color: (userLine.hovered || userLine.visualFocus) && - !(userMoreButton.hovered || userMoreButton.visualFocus) ? - palette.highlight : palette.window - radius: Style.halfTrayWindowRadius - } - contentItem: RowLayout { id: userLineLayout - spacing: Style.userStatusSpacing + spacing: Style.userLineSpacing Image { id: accountAvatar @@ -147,23 +136,12 @@ AbstractButton { onClicked: userMoreButtonMenu.visible ? userMoreButtonMenu.close() : userMoreButtonMenu.popup() - Image { - anchors.fill: parent - source: "image://svgimage-custom-color/more.svg/" + palette.windowText - fillMode: Image.PreserveAspectFit - anchors.rightMargin: Style.accountLabelsAnchorsMargin - } + icon.source: "image://svgimage-custom-color/more.svg/" + palette.windowText AutoSizingMenu { id: userMoreButtonMenu closePolicy: Menu.CloseOnPressOutsideParent | Menu.CloseOnEscape - background: Rectangle { - border.color: palette.dark - radius: Style.halfTrayWindowRadius - color: palette.window - } - MenuItem { visible: model.isConnected && model.serverHasUserStatus height: visible ? implicitHeight : 0 @@ -171,12 +149,7 @@ AbstractButton { font.pixelSize: Style.topLinePixelSize hoverEnabled: true onClicked: showUserStatusSelector(index) - - background: Rectangle { - radius: Style.halfTrayWindowRadius - color: parent.hovered ? palette.highlight : palette.window - } - } + } MenuItem { text: model.isConnected ? qsTr("Log out") : qsTr("Log in") @@ -198,12 +171,7 @@ AbstractButton { } accountMenu.close() } - - background: Rectangle { - radius: Style.halfTrayWindowRadius - color: parent.hovered ? palette.highlight : palette.window - } - } + } MenuItem { id: removeAccountButton @@ -218,12 +186,7 @@ AbstractButton { Accessible.role: Accessible.Button Accessible.name: text Accessible.onPressAction: removeAccountButton.clicked() - - background: Rectangle { - radius: Style.halfTrayWindowRadius - color: parent.hovered ? palette.highlight : palette.window - } - } + } } } } diff --git a/src/libsync/account.cpp b/src/libsync/account.cpp index df4030de8c64d..84c68b010db84 100644 --- a/src/libsync/account.cpp +++ b/src/libsync/account.cpp @@ -222,7 +222,7 @@ QColor Account::accentColor() const auto darknessAdjustment = static_cast((1 - Theme::getColorDarkness(accentColor)) * effectMultiplier); darknessAdjustment *= darknessAdjustment; // Square the value to pronounce the darkness more in lighter colours - const auto baseAdjustment = 125; + constexpr auto baseAdjustment = 125; const auto adjusted = Theme::isDarkColor(accentColor) ? accentColor : accentColor.darker(baseAdjustment + darknessAdjustment); return adjusted; } diff --git a/theme/Style/Style.qml b/theme/Style/Style.qml index 2bb1905d3bd9c..6d63d2898a705 100644 --- a/theme/Style/Style.qml +++ b/theme/Style/Style.qml @@ -9,17 +9,9 @@ QtObject { readonly property bool darkMode: Theme.darkMode // Colors - readonly property color ncBlue: Theme.wizardHeaderBackgroundColor + readonly property color ncBlue: Theme.wizardHeaderBackgroundColor readonly property color ncHeaderTextColor: Theme.wizardHeaderTitleColor - readonly property color ncTextColor: Theme.systemPalette.windowText - readonly property color ncTextBrightColor: "white" - readonly property color ncSecondaryTextColor: "#808080" - 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.window - readonly property color buttonBackgroundColor: Theme.systemPalette.button - readonly property color positiveColor: Qt.rgba(0.38, 0.74, 0.38, 1) + readonly property color accentColor: UserModel.currentUser ? UserModel.currentUser.accentColor : ncBlue readonly property color currentUserHeaderColor: UserModel.currentUser ? UserModel.currentUser.headerColor : ncBlue readonly property color currentUserHeaderTextColor: UserModel.currentUser ? UserModel.currentUser.headerTextColor : ncHeaderTextColor @@ -52,7 +44,7 @@ QtObject { // dropdown menus radius property int halfTrayWindowRadius: 5 property int trayWindowBorderWidth: variableSize(1) - property int trayWindowHeaderHeight: variableSize(60) + property int trayWindowHeaderHeight: variableSize(50) property int trayHorizontalMargin: 10 property int trayModalWidth: 380 property int trayModalHeight: 490 @@ -71,6 +63,7 @@ QtObject { property int iconButtonWidth: 36 property int standardPrimaryButtonHeight: 40 readonly property int smallIconSize: 16 + readonly property int extraSmallIconSize: 8 property int minActivityHeight: variableSize(32) @@ -100,14 +93,10 @@ QtObject { property double trayFoldersMenuButtonDropDownCaretIconSizeFraction: 0.3 property double trayFoldersMenuButtonMainIconSizeFraction: 1.0 - trayFoldersMenuButtonDropDownCaretIconSizeFraction - property int addAccountButtonHeight: 50 - property int activityListButtonWidth: 42 property int activityListButtonHeight: 32 property int activityListButtonIconSize: 18 - property int headerButtonIconSize: 32 - property int addButtonIconSize: 26 - property int dismissButtonSize: 26 + property int headerButtonIconSize: 48 property int minimumActivityItemHeight: 24 property int accountIconsMenuMargin: 7 @@ -129,6 +118,7 @@ QtObject { property int userStatusEmojiSize: 8 property int userStatusSpacing: trayHorizontalMargin property int userStatusAnchorsMargin: 2 + property int userLineSpacing: smallSpacing property int accountServerAnchorsMargin: 10 property int accountLabelsSpacing: 4 property int accountLabelsAnchorsMargin: 7 @@ -150,6 +140,7 @@ QtObject { readonly property int unifiedSearchResultSectionItemLeftPadding: 16 readonly property int unifiedSearchResultSectionItemVerticalPadding: 8 readonly property int unifiedSearchResultNothingFoundHorizontalMargin: 10 + readonly property int unifiedSearchInputContainerHeight: 40 readonly property int radioButtonCustomMarginLeftInner: 4 readonly property int radioButtonCustomMarginLeftOuter: 5 @@ -190,10 +181,6 @@ QtObject { property int progressBarRadius: 4 property int progressBarContentBorderWidth: 1 property int progressBarBackgroundBorderWidth: 1 - property color progressBarContentColor: ncBlue - property color progressBarContentBorderColor: menuBorder - property color progressBarBackgroundColor: backgroundColor - property color progressBarBackgroundBorderColor: menuBorder property int newActivitiesButtonWidth: 150 property int newActivitiesButtonHeight: 40