From 74193ffff9ca6bb496c1ffe6de298d3544ac3a6c Mon Sep 17 00:00:00 2001 From: 10r3n20 Date: Tue, 16 Nov 2021 11:29:48 +0100 Subject: [PATCH 1/4] moved padding to PackageTybeTab and replaced default margin with narrow margin --- plugins/Marketplace/resources/qml/ManagePackagesButton.qml | 1 - plugins/Marketplace/resources/qml/Marketplace.qml | 2 -- plugins/Marketplace/resources/qml/PackageTypeTab.qml | 1 + 3 files changed, 1 insertion(+), 3 deletions(-) diff --git a/plugins/Marketplace/resources/qml/ManagePackagesButton.qml b/plugins/Marketplace/resources/qml/ManagePackagesButton.qml index 31b97d89ed..8d64b27609 100644 --- a/plugins/Marketplace/resources/qml/ManagePackagesButton.qml +++ b/plugins/Marketplace/resources/qml/ManagePackagesButton.qml @@ -20,7 +20,6 @@ Button color: backgroundColor border.color: transparent radius: Math.round(width * 0.5) - } Cura.ToolTip diff --git a/plugins/Marketplace/resources/qml/Marketplace.qml b/plugins/Marketplace/resources/qml/Marketplace.qml index 430c237252..93d616209b 100644 --- a/plugins/Marketplace/resources/qml/Marketplace.qml +++ b/plugins/Marketplace/resources/qml/Marketplace.qml @@ -100,14 +100,12 @@ Window PackageTypeTab { width: implicitWidth - padding: UM.Theme.getSize("default_margin").width/2 text: catalog.i18nc("@button", "Plugins") onClicked: content.source = "Plugins.qml" } PackageTypeTab { width: implicitWidth - padding: Math.round(UM.Theme.getSize("default_margin").width / 2) text: catalog.i18nc("@button", "Materials") onClicked: content.source = "Materials.qml" } diff --git a/plugins/Marketplace/resources/qml/PackageTypeTab.qml b/plugins/Marketplace/resources/qml/PackageTypeTab.qml index 31fbabc294..6f54932c07 100644 --- a/plugins/Marketplace/resources/qml/PackageTypeTab.qml +++ b/plugins/Marketplace/resources/qml/PackageTypeTab.qml @@ -8,6 +8,7 @@ import UM 1.0 as UM TabButton { property string pageTitle + padding: UM.Theme.getSize("narrow_margin").width background: Rectangle { From e4cd310303a304b78ae0db64693799f6ea4c68bd Mon Sep 17 00:00:00 2001 From: 10r3n20 Date: Tue, 16 Nov 2021 11:37:52 +0100 Subject: [PATCH 2/4] added hover state to inactive tabs --- plugins/Marketplace/resources/qml/PackageTypeTab.qml | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/plugins/Marketplace/resources/qml/PackageTypeTab.qml b/plugins/Marketplace/resources/qml/PackageTypeTab.qml index 6f54932c07..4d82333b02 100644 --- a/plugins/Marketplace/resources/qml/PackageTypeTab.qml +++ b/plugins/Marketplace/resources/qml/PackageTypeTab.qml @@ -9,11 +9,15 @@ TabButton { property string pageTitle padding: UM.Theme.getSize("narrow_margin").width + hoverEnabled: true + property color inactiveBackgroundColor : hovered ? UM.Theme.getColor("action_button_hovered") : UM.Theme.getColor("detail_background") + property color activeBackgroundColor : UM.Theme.getColor("main_background") + background: Rectangle { anchors.fill: parent - color: parent.checked ? UM.Theme.getColor("main_background") : UM.Theme.getColor("detail_background") + color: parent.checked ? activeBackgroundColor : inactiveBackgroundColor border.color: UM.Theme.getColor("detail_background") border.width: UM.Theme.getSize("thick_lining").width } From 0e646a97f2852bb94e8ec11ad7c7de7b62ac5ada Mon Sep 17 00:00:00 2001 From: 10r3n20 Date: Tue, 16 Nov 2021 11:40:24 +0100 Subject: [PATCH 3/4] made font bold in tabs to be more aligned in weight with the gear icon --- plugins/Marketplace/resources/qml/PackageTypeTab.qml | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/plugins/Marketplace/resources/qml/PackageTypeTab.qml b/plugins/Marketplace/resources/qml/PackageTypeTab.qml index 4d82333b02..0520b74fb6 100644 --- a/plugins/Marketplace/resources/qml/PackageTypeTab.qml +++ b/plugins/Marketplace/resources/qml/PackageTypeTab.qml @@ -13,7 +13,6 @@ TabButton property color inactiveBackgroundColor : hovered ? UM.Theme.getColor("action_button_hovered") : UM.Theme.getColor("detail_background") property color activeBackgroundColor : UM.Theme.getColor("main_background") - background: Rectangle { anchors.fill: parent @@ -25,7 +24,7 @@ TabButton contentItem: Label { text: parent.text - font: UM.Theme.getFont("medium") + font: UM.Theme.getFont("medium_bold") color: UM.Theme.getColor("text") width: contentWidth anchors.centerIn: parent From 4c6441f65e6c294173e2d87db2fd8b1323f8225b Mon Sep 17 00:00:00 2001 From: 10r3n20 Date: Tue, 16 Nov 2021 14:02:07 +0100 Subject: [PATCH 4/4] moved manage packages button inside the tabBar and adjusted styling --- .../resources/qml/ManagePackagesButton.qml | 18 +++++++++++------- .../Marketplace/resources/qml/Marketplace.qml | 19 +++++-------------- .../resources/qml/PackageTypeTab.qml | 1 + 3 files changed, 17 insertions(+), 21 deletions(-) diff --git a/plugins/Marketplace/resources/qml/ManagePackagesButton.qml b/plugins/Marketplace/resources/qml/ManagePackagesButton.qml index 8d64b27609..0dc33d62f3 100644 --- a/plugins/Marketplace/resources/qml/ManagePackagesButton.qml +++ b/plugins/Marketplace/resources/qml/ManagePackagesButton.qml @@ -7,18 +7,21 @@ import Cura 1.6 as Cura import QtQuick 2.15 import QtQuick.Controls 2.15 -Button +TabButton { id: root - width: UM.Theme.getSize("button_icon").width + width: UM.Theme.getSize("button_icon").width+UM.Theme.getSize("narrow_margin").width height: UM.Theme.getSize("button_icon").height hoverEnabled: true - property color backgroundColor: hovered ? UM.Theme.getColor("action_button_hovered") : UM.Theme.getColor("action_button") + property color inactiveBackgroundColor : hovered ? UM.Theme.getColor("action_button_hovered") : UM.Theme.getColor("detail_background") + property color activeBackgroundColor : UM.Theme.getColor("main_background") + leftInset: UM.Theme.getSize("narrow_margin").width background: Rectangle { - color: backgroundColor - border.color: transparent + color: parent.checked ? activeBackgroundColor : inactiveBackgroundColor + border.color: parent.checked ? UM.Theme.getColor("detail_background") : "transparent" + border.width: UM.Theme.getSize("thick_lining").width radius: Math.round(width * 0.5) } @@ -39,7 +42,8 @@ Button color: UM.Theme.getColor("icon") source: UM.Theme.getIcon("Settings") - anchors.centerIn: parent - + anchors.horizontalCenter: parent.horizontalCenter + anchors.horizontalCenterOffset: Math.round(UM.Theme.getSize("narrow_margin").width /2) + anchors.verticalCenter: parent.verticalCenter } } diff --git a/plugins/Marketplace/resources/qml/Marketplace.qml b/plugins/Marketplace/resources/qml/Marketplace.qml index 93d616209b..e18adf51f2 100644 --- a/plugins/Marketplace/resources/qml/Marketplace.qml +++ b/plugins/Marketplace/resources/qml/Marketplace.qml @@ -75,24 +75,11 @@ Window Layout.preferredWidth: parent.width Layout.preferredHeight: childrenRect.height - ManagePackagesButton - { - id: managePackagesButton - - anchors.right: parent.right - anchors.rightMargin: UM.Theme.getSize("default_margin").width - - onClicked: - { - content.source = "ManagedPackages.qml" - } - } - // Page selection. TabBar { id: pageSelectionTabBar - anchors.right: managePackagesButton.left + anchors.right: parent.right anchors.rightMargin: UM.Theme.getSize("default_margin").width height: UM.Theme.getSize("button_icon").height spacing: 0 @@ -109,6 +96,10 @@ Window text: catalog.i18nc("@button", "Materials") onClicked: content.source = "Materials.qml" } + ManagePackagesButton + { + onClicked: content.source = "ManagedPackages.qml" + } } } diff --git a/plugins/Marketplace/resources/qml/PackageTypeTab.qml b/plugins/Marketplace/resources/qml/PackageTypeTab.qml index 0520b74fb6..79eaa9a16c 100644 --- a/plugins/Marketplace/resources/qml/PackageTypeTab.qml +++ b/plugins/Marketplace/resources/qml/PackageTypeTab.qml @@ -9,6 +9,7 @@ TabButton { property string pageTitle padding: UM.Theme.getSize("narrow_margin").width + horizontalPadding: UM.Theme.getSize("default_margin").width hoverEnabled: true property color inactiveBackgroundColor : hovered ? UM.Theme.getColor("action_button_hovered") : UM.Theme.getColor("detail_background") property color activeBackgroundColor : UM.Theme.getColor("main_background")