From 8d0df62c499f3f432b79c8608fe2e50f6e14d2f2 Mon Sep 17 00:00:00 2001 From: Claudio Cambra Date: Mon, 11 Jul 2022 18:56:35 +0200 Subject: [PATCH] Stop styling QML unified search items hierarchically, use global Style constants Signed-off-by: Claudio Cambra --- .../UnifiedSearchResultFetchMoreTrigger.qml | 6 ++-- src/gui/tray/UnifiedSearchResultItem.qml | 12 +++---- .../tray/UnifiedSearchResultItemSkeleton.qml | 14 ++++---- ...ifiedSearchResultItemSkeletonContainer.qml | 33 +++---------------- src/gui/tray/UnifiedSearchResultListItem.qml | 25 ++------------ .../tray/UnifiedSearchResultNothingFound.qml | 6 ++-- .../tray/UnifiedSearchResultSectionItem.qml | 8 ++--- src/gui/tray/Window.qml | 22 ------------- theme/Style/Style.qml | 11 ++++--- 9 files changed, 39 insertions(+), 98 deletions(-) diff --git a/src/gui/tray/UnifiedSearchResultFetchMoreTrigger.qml b/src/gui/tray/UnifiedSearchResultFetchMoreTrigger.qml index 02ea71f2b..83982841d 100644 --- a/src/gui/tray/UnifiedSearchResultFetchMoreTrigger.qml +++ b/src/gui/tray/UnifiedSearchResultFetchMoreTrigger.qml @@ -9,9 +9,9 @@ ColumnLayout { property bool isFetchMoreInProgress: false - property bool isWihinViewPort: false + property bool isWithinViewPort: false - property int fontSize: Style.topLinePixelSize + property int fontSize: Style.unifiedSearchResultTitleFontSize property string textColor: Style.ncSecondaryTextColor @@ -34,7 +34,7 @@ ColumnLayout { BusyIndicator { id: unifiedSearchResultItemFetchMoreIconInProgress running: visible - visible: unifiedSearchResultItemFetchMore.isFetchMoreInProgress && unifiedSearchResultItemFetchMore.isWihinViewPort + visible: unifiedSearchResultItemFetchMore.isFetchMoreInProgress && unifiedSearchResultItemFetchMore.isWithinViewPort Layout.alignment: Qt.AlignVCenter | Qt.AlignHCenter Layout.preferredWidth: parent.height * 0.70 Layout.preferredHeight: parent.height * 0.70 diff --git a/src/gui/tray/UnifiedSearchResultItem.qml b/src/gui/tray/UnifiedSearchResultItem.qml index 702b3a331..d8a520f1e 100644 --- a/src/gui/tray/UnifiedSearchResultItem.qml +++ b/src/gui/tray/UnifiedSearchResultItem.qml @@ -15,13 +15,13 @@ RowLayout { property bool isRounded: false - property int textLeftMargin: 18 - property int textRightMargin: 16 - property int iconWidth: 24 - property int iconLeftMargin: 12 + property int textLeftMargin: Style.unifiedSearchResultTextLeftMargin + property int textRightMargin: Style.unifiedSearchResultTextRightMargin + property int iconWidth: Style.unifiedSearchResultIconWidth + property int iconLeftMargin: Style.unifiedSearchResultIconLeftMargin - property int titleFontSize: Style.topLinePixelSize - property int sublineFontSize: Style.subLinePixelSize + property int titleFontSize: Style.unifiedSearchResultTitleFontSize + property int sublineFontSize: Style.unifiedSearchResultSublineFontSize property color titleColor: Style.ncTextColor property color sublineColor: Style.ncSecondaryTextColor diff --git a/src/gui/tray/UnifiedSearchResultItemSkeleton.qml b/src/gui/tray/UnifiedSearchResultItemSkeleton.qml index ddc38d29d..a7a1a6f95 100644 --- a/src/gui/tray/UnifiedSearchResultItemSkeleton.qml +++ b/src/gui/tray/UnifiedSearchResultItemSkeleton.qml @@ -6,13 +6,13 @@ import Style 1.0 RowLayout { id: unifiedSearchResultSkeletonItemDetails - property int textLeftMargin: 18 - property int textRightMargin: 16 - property int iconWidth: 24 - property int iconLeftMargin: 12 + property int textLeftMargin: Style.unifiedSearchResultTextLeftMargin + property int textRightMargin: Style.unifiedSearchResultTextRightMargin + property int iconWidth: Style.unifiedSearchResultIconWidth + property int iconLeftMargin: Style.unifiedSearchResultIconLeftMargin - property int titleFontSize: Style.topLinePixelSize - property int sublineFontSize: Style.subLinePixelSize + property int titleFontSize: Style.unifiedSearchResultTitleFontSize + property int sublineFontSize: Style.unifiedSearchResultSublineFontSize property color titleColor: Style.ncTextColor property color sublineColor: Style.ncSecondaryTextColor @@ -24,6 +24,8 @@ RowLayout { Accessible.role: Accessible.ListItem Accessible.name: qsTr("Search result skeleton.").arg(index) + height: Style.trayWindowHeaderHeight + Rectangle { id: unifiedSearchResultSkeletonThumbnail color: unifiedSearchResultSkeletonItemDetails.iconColor diff --git a/src/gui/tray/UnifiedSearchResultItemSkeletonContainer.qml b/src/gui/tray/UnifiedSearchResultItemSkeletonContainer.qml index e128f6860..0ed23482c 100644 --- a/src/gui/tray/UnifiedSearchResultItemSkeletonContainer.qml +++ b/src/gui/tray/UnifiedSearchResultItemSkeletonContainer.qml @@ -1,49 +1,26 @@ import QtQml 2.15 import QtQuick 2.15 -import QtQuick.Controls 2.3 import Style 1.0 Column { id: unifiedSearchResultsListViewSkeletonColumn - property int textLeftMargin: 18 - property int textRightMargin: 16 - property int iconWidth: 24 - property int iconLeftMargin: 12 - property int itemHeight: Style.trayWindowHeaderHeight - property int titleFontSize: Style.topLinePixelSize - property int sublineFontSize: Style.subLinePixelSize - property color titleColor: Style.ncTextColor - property color sublineColor: Style.ncSecondaryTextColor - property color iconColor: "#afafaf" - Repeater { model: 10 UnifiedSearchResultItemSkeleton { - textLeftMargin: unifiedSearchResultsListViewSkeletonColumn.textLeftMargin - textRightMargin: unifiedSearchResultsListViewSkeletonColumn.textRightMargin - iconWidth: unifiedSearchResultsListViewSkeletonColumn.iconWidth - iconLeftMargin: unifiedSearchResultsListViewSkeletonColumn.iconLeftMargin width: unifiedSearchResultsListViewSkeletonColumn.width - height: unifiedSearchResultsListViewSkeletonColumn.itemHeight - index: model.index - titleFontSize: unifiedSearchResultsListViewSkeletonColumn.titleFontSize - sublineFontSize: unifiedSearchResultsListViewSkeletonColumn.sublineFontSize - titleColor: unifiedSearchResultsListViewSkeletonColumn.titleColor - sublineColor: unifiedSearchResultsListViewSkeletonColumn.sublineColor - iconColor: unifiedSearchResultsListViewSkeletonColumn.iconColor } } OpacityAnimator { - target: unifiedSearchResultsListViewSkeletonColumn; - from: 0.5; - to: 1; + target: unifiedSearchResultsListViewSkeletonColumn + from: 0.5 + to: 1 duration: 800 running: unifiedSearchResultsListViewSkeletonColumn.visible - loops: Animation.Infinite; + loops: Animation.Infinite easing { - type: Easing.InOutBounce; + type: Easing.InOutBounce } } } diff --git a/src/gui/tray/UnifiedSearchResultListItem.qml b/src/gui/tray/UnifiedSearchResultListItem.qml index ce942a4d1..c53ca4066 100644 --- a/src/gui/tray/UnifiedSearchResultListItem.qml +++ b/src/gui/tray/UnifiedSearchResultListItem.qml @@ -7,17 +7,6 @@ import com.nextcloud.desktopclient 1.0 MouseArea { id: unifiedSearchResultMouseArea - property int textLeftMargin: 18 - property int textRightMargin: 16 - property int iconWidth: 24 - property int iconLeftMargin: 12 - - property int titleFontSize: Style.topLinePixelSize - property int sublineFontSize: Style.subLinePixelSize - - property color titleColor: Style.ncTextColor - property color sublineColor: Style.ncSecondaryTextColor - property string currentFetchMoreInProgressProviderId: "" readonly property bool isFetchMoreTrigger: model.typeAsString === "FetchMoreTrigger" @@ -33,6 +22,8 @@ MouseArea { enabled: !isFetchMoreTrigger || !isSearchInProgress hoverEnabled: enabled + height: Style.unifiedSearchItemHeight + ToolTip { id: unifiedSearchResultMouseAreaTooltip visible: unifiedSearchResultMouseArea.containsMouse @@ -64,14 +55,6 @@ MouseArea { icons: Theme.darkMode ? model.darkIcons : model.lightIcons iconPlaceholder: Theme.darkMode ? model.darkImagePlaceholder : model.lightImagePlaceholder isRounded: model.isRounded - textLeftMargin: unifiedSearchResultMouseArea.textLeftMargin - textRightMargin: unifiedSearchResultMouseArea.textRightMargin - iconWidth: unifiedSearchResultMouseArea.iconWidth - iconLeftMargin: unifiedSearchResultMouseArea.iconLeftMargin - titleFontSize: unifiedSearchResultMouseArea.titleFontSize - sublineFontSize: unifiedSearchResultMouseArea.sublineFontSize - titleColor: unifiedSearchResultMouseArea.titleColor - sublineColor: unifiedSearchResultMouseArea.sublineColor } } @@ -81,9 +64,7 @@ MouseArea { isFetchMoreInProgress: unifiedSearchResultMouseArea.isFetchMoreInProgress width: unifiedSearchResultMouseArea.width height: unifiedSearchResultMouseArea.height - isWihinViewPort: !unifiedSearchResultMouseArea.isPooled - fontSize: unifiedSearchResultMouseArea.titleFontSize - textColor: unifiedSearchResultMouseArea.sublineColor + isWithinViewPort: !unifiedSearchResultMouseArea.isPooled } } diff --git a/src/gui/tray/UnifiedSearchResultNothingFound.qml b/src/gui/tray/UnifiedSearchResultNothingFound.qml index 67bd8108e..cee73c336 100644 --- a/src/gui/tray/UnifiedSearchResultNothingFound.qml +++ b/src/gui/tray/UnifiedSearchResultNothingFound.qml @@ -9,9 +9,9 @@ ColumnLayout { required property string text - spacing: 8 - anchors.leftMargin: 10 - anchors.rightMargin: 10 + spacing: Style.standardSpacing + anchors.leftMargin: Style.unifiedSearchResultNothingFoundHorizontalMargin + anchors.rightMargin: Style.unifiedSearchResultNothingFoundHorizontalMargin Image { id: unifiedSearchResultsNoResultsLabelIcon diff --git a/src/gui/tray/UnifiedSearchResultSectionItem.qml b/src/gui/tray/UnifiedSearchResultSectionItem.qml index 89ad6bf31..ebc691a9c 100644 --- a/src/gui/tray/UnifiedSearchResultSectionItem.qml +++ b/src/gui/tray/UnifiedSearchResultSectionItem.qml @@ -8,12 +8,12 @@ import com.nextcloud.desktopclient 1.0 Label { required property string section - topPadding: 8 - bottomPadding: 8 - leftPadding: 16 + topPadding: Style.unifiedSearchResultSectionItemVerticalPadding + bottomPadding: Style.unifiedSearchResultSectionItemVerticalPadding + leftPadding: Style.unifiedSearchResultSectionItemLeftPadding text: section - font.pixelSize: Style.topLinePixelSize + font.pixelSize: Style.unifiedSearchResultTitleFontSize color: UserModel.currentUser.accentColor Accessible.role: Accessible.Separator diff --git a/src/gui/tray/Window.qml b/src/gui/tray/Window.qml index 1e84e1847..5508d0803 100644 --- a/src/gui/tray/Window.qml +++ b/src/gui/tray/Window.qml @@ -665,9 +665,6 @@ Window { id: unifiedSearchResultsErrorLabel visible: UserModel.currentUser.unifiedSearchResultsListModel.errorString && !unifiedSearchResultsListView.visible && ! UserModel.currentUser.unifiedSearchResultsListModel.isSearchInProgress && ! UserModel.currentUser.unifiedSearchResultsListModel.currentFetchMoreInProgressProviderId text: UserModel.currentUser.unifiedSearchResultsListModel.errorString - color: Style.errorBoxBackgroundColor - backgroundColor: Style.errorBoxTextColor - borderColor: "transparent" anchors.top: trayWindowUnifiedSearchInputContainer.bottom anchors.left: trayWindowBackground.left anchors.right: trayWindowBackground.right @@ -716,16 +713,6 @@ Window { anchors.left: trayWindowBackground.left anchors.right: trayWindowBackground.right anchors.bottom: trayWindowBackground.bottom - textLeftMargin: trayWindowBackground.Style.unifiedSearchResultTextLeftMargin - textRightMargin: trayWindowBackground.Style.unifiedSearchResultTextRightMargin - iconWidth: trayWindowBackground.Style.unifiedSearchResulIconWidth - iconLeftMargin: trayWindowBackground.Style.unifiedSearchResulIconLeftMargin - itemHeight: trayWindowBackground.Style.unifiedSearchItemHeight - titleFontSize: trayWindowBackground.Style.unifiedSearchResulTitleFontSize - sublineFontSize: trayWindowBackground.Style.unifiedSearchResulSublineFontSize - titleColor: Style.ncTextColor - sublineColor: Style.ncSecondaryTextColor - iconColor: "#afafaf" } ScrollView { @@ -761,16 +748,7 @@ Window { delegate: UnifiedSearchResultListItem { width: unifiedSearchResultsListView.width - height: Style.unifiedSearchItemHeight isSearchInProgress: unifiedSearchResultsListView.model.isSearchInProgress - textLeftMargin: Style.unifiedSearchResultTextLeftMargin - textRightMargin: Style.unifiedSearchResultTextRightMargin - iconWidth: Style.unifiedSearchResulIconWidth - iconLeftMargin: Style.unifiedSearchResulIconLeftMargin - titleFontSize: Style.unifiedSearchResulTitleFontSize - sublineFontSize: Style.unifiedSearchResulSublineFontSize - titleColor: Style.ncTextColor - sublineColor: Style.ncSecondaryTextColor currentFetchMoreInProgressProviderId: unifiedSearchResultsListView.model.currentFetchMoreInProgressProviderId fetchMoreTriggerClicked: unifiedSearchResultsListView.model.fetchMoreTriggerClicked resultClicked: unifiedSearchResultsListView.model.resultClicked diff --git a/theme/Style/Style.qml b/theme/Style/Style.qml index 42e32a036..1d8b200e3 100644 --- a/theme/Style/Style.qml +++ b/theme/Style/Style.qml @@ -101,10 +101,13 @@ QtObject { readonly property int unifiedSearchItemHeight: trayWindowHeaderHeight readonly property int unifiedSearchResultTextLeftMargin: 18 readonly property int unifiedSearchResultTextRightMargin: 16 - readonly property int unifiedSearchResulIconWidth: 24 - readonly property int unifiedSearchResulIconLeftMargin: 12 - readonly property int unifiedSearchResulTitleFontSize: topLinePixelSize - readonly property int unifiedSearchResulSublineFontSize: subLinePixelSize + readonly property int unifiedSearchResultIconWidth: 24 + readonly property int unifiedSearchResultIconLeftMargin: 12 + readonly property int unifiedSearchResultTitleFontSize: topLinePixelSize + readonly property int unifiedSearchResultSublineFontSize: subLinePixelSize + readonly property int unifiedSearchResultSectionItemLeftPadding: 16 + readonly property int unifiedSearchResultSectionItemVerticalPadding: 8 + readonly property int unifiedSearchResultNothingFoundHorizontalMargin: 10 readonly property var fontMetrics: FontMetrics {} -- 2.30.2