diff --git a/client/ui/qml/Components/HomeRootMenuButton.qml b/client/ui/qml/Components/HomeRootMenuButton.qml index aa6d8f9b..ca800125 100644 --- a/client/ui/qml/Components/HomeRootMenuButton.qml +++ b/client/ui/qml/Components/HomeRootMenuButton.qml @@ -62,25 +62,13 @@ Item { hoverEnabled: false image: rightImageSource imageColor: rightImageColor - visible: rightImageSource ? true : false - implicitSize: 18 - backGroudRadius: 5 - horizontalPadding: 0 - padding: 0 - spacing: 0 - - - Rectangle { - id: rightImageBackground - anchors.fill: parent - radius: 16 - color: "transparent" - - Behavior on color { - PropertyAnimation { duration: 200 } - } - } + icon.width: 18 + icon.height: 18 + backgroundRadius: 16 + horizontalPadding: 4 + topPadding: 4 + bottomPadding: 3 } } @@ -107,26 +95,25 @@ Item { } } - MouseArea { anchors.fill: parent cursorShape: Qt.PointingHandCursor hoverEnabled: true onEntered: { - rightImageBackground.color = rightImage.hoveredColor + rightImage.backgroundColor = rightImage.hoveredColor root.textOpacity = 0.8 } onExited: { - rightImageBackground.color = rightImage.defaultColor + rightImage.backgroundColor = rightImage.defaultColor root.textOpacity = 1 } onPressedChanged: { - rightImageBackground.color = pressed ? rightImage.pressedColor : entered ? rightImage.hoveredColor : rightImage.defaultColor + rightImage.backgroundColor = pressed ? rightImage.pressedColor : entered ? rightImage.hoveredColor : rightImage.defaultColor root.textOpacity = 0.7 } diff --git a/client/ui/qml/Controls2/BackButtonType.qml b/client/ui/qml/Controls2/BackButtonType.qml index 67ffbd9c..f1044745 100644 --- a/client/ui/qml/Controls2/BackButtonType.qml +++ b/client/ui/qml/Controls2/BackButtonType.qml @@ -23,6 +23,9 @@ Item { image: backButtonImage imageColor: "#D7D8DB" + implicitWidth: 40 + implicitHeight: 40 + onClicked: { if (backButtonFunction && typeof backButtonFunction === "function") { backButtonFunction() diff --git a/client/ui/qml/Controls2/DropDownType.qml b/client/ui/qml/Controls2/DropDownType.qml index 2feb5e17..b91f0b7a 100644 --- a/client/ui/qml/Controls2/DropDownType.qml +++ b/client/ui/qml/Controls2/DropDownType.qml @@ -24,6 +24,8 @@ Item { property string rootButtonImage: "qrc:/images/controls/chevron-down.svg" property string rootButtonImageColor: "#D7D8DB" property string rootButtonBackgroundColor: "#1C1D21" + property string rootButtonBackgroundHoveredColor: "#1C1D21" + property string rootButtonBackgroundPressedColor: "#1C1D21" property string rootButtonHoveredBorderColor: "#494B50" property string rootButtonDefaultBorderColor: "#2C2D30" @@ -71,6 +73,10 @@ Item { Behavior on border.color { PropertyAnimation { duration: 200 } } + + Behavior on color { + PropertyAnimation { duration: 200 } + } } RowLayout { @@ -112,6 +118,9 @@ Item { ImageButtonType { Layout.rightMargin: 16 + implicitWidth: 40 + implicitHeight: 40 + hoverEnabled: false image: rootButtonImage imageColor: rootButtonImageColor @@ -126,12 +135,20 @@ Item { onEntered: { if (menu.visible === false) { rootButtonBackground.border.color = rootButtonHoveredBorderColor + rootButtonBackground.color = rootButtonBackgroundHoveredColor } } onExited: { if (menu.visible === false) { rootButtonBackground.border.color = rootButtonDefaultBorderColor + rootButtonBackground.color = rootButtonBackgroundColor + } + } + + onPressed: { + if (menu.visible === false) { + rootButtonBackground.color = pressed ? rootButtonBackgroundPressedColor : entered ? rootButtonHoveredBorderColor : rootButtonDefaultBorderColor } } diff --git a/client/ui/qml/Controls2/Header2Type.qml b/client/ui/qml/Controls2/Header2Type.qml index 9433f52a..4d812f6c 100644 --- a/client/ui/qml/Controls2/Header2Type.qml +++ b/client/ui/qml/Controls2/Header2Type.qml @@ -31,6 +31,9 @@ Item { ImageButtonType { id: headerActionButton + implicitWidth: 40 + implicitHeight: 40 + image: root.actionButtonImage imageColor: "#D7D8DB" diff --git a/client/ui/qml/Controls2/HeaderType.qml b/client/ui/qml/Controls2/HeaderType.qml index b4af3784..d0ed3418 100644 --- a/client/ui/qml/Controls2/HeaderType.qml +++ b/client/ui/qml/Controls2/HeaderType.qml @@ -36,6 +36,9 @@ Item { ImageButtonType { id: headerActionButton + implicitWidth: 40 + implicitHeight: 40 + Layout.alignment: Qt.AlignRight image: root.actionButtonImage diff --git a/client/ui/qml/Controls2/ImageButtonType.qml b/client/ui/qml/Controls2/ImageButtonType.qml index 55e19f42..1ab57511 100644 --- a/client/ui/qml/Controls2/ImageButtonType.qml +++ b/client/ui/qml/Controls2/ImageButtonType.qml @@ -15,11 +15,8 @@ Button { property string imageColor: "#878B91" property string disableImageColor: "#2C2D30" - property int backGroudRadius: 12 - property int implicitSize: 40 - - implicitWidth: implicitSize - implicitHeight: implicitSize + property alias backgroundColor: background.color + property alias backgroundRadius: background.radius hoverEnabled: true @@ -34,16 +31,16 @@ Button { id: background anchors.fill: parent - radius: backGroudRadius color: { if (root.enabled) { - if(root.pressed) { + if (root.pressed) { return pressedColor } return hovered ? hoveredColor : defaultColor } return defaultColor } + radius: 12 Behavior on color { PropertyAnimation { duration: 200 } } diff --git a/client/ui/qml/Controls2/LabelWithButtonType.qml b/client/ui/qml/Controls2/LabelWithButtonType.qml index 7a1489c0..bb051f76 100644 --- a/client/ui/qml/Controls2/LabelWithButtonType.qml +++ b/client/ui/qml/Controls2/LabelWithButtonType.qml @@ -119,6 +119,9 @@ Item { ImageButtonType { id: rightImage + implicitWidth: 40 + implicitHeight: 40 + hoverEnabled: false image: rightImageSource imageColor: rightImageColor diff --git a/client/ui/qml/Controls2/TextFieldWithHeaderType.qml b/client/ui/qml/Controls2/TextFieldWithHeaderType.qml index 3a3f5a1a..b09ae00d 100644 --- a/client/ui/qml/Controls2/TextFieldWithHeaderType.qml +++ b/client/ui/qml/Controls2/TextFieldWithHeaderType.qml @@ -167,7 +167,7 @@ Item { } onEntered: { - backgroud.border.color = getBackgroundBorderColor(bgBorderHoveredColor) + backgroud.border.color = getBackgroundBorderColor(bgBorderHoveredColor) } diff --git a/client/ui/qml/Controls2/TopCloseButtonType.qml b/client/ui/qml/Controls2/TopCloseButtonType.qml index ed89b5a6..4a738214 100644 --- a/client/ui/qml/Controls2/TopCloseButtonType.qml +++ b/client/ui/qml/Controls2/TopCloseButtonType.qml @@ -23,6 +23,9 @@ Popup { image: "qrc:/images/svg/close_black_24dp.svg" imageColor: "#D7D8DB" + implicitWidth: 40 + implicitHeight: 40 + onClicked: { PageController.goToDrawerRootPage() } diff --git a/client/ui/qml/Pages2/PageHome.qml b/client/ui/qml/Pages2/PageHome.qml index 77c60684..ee7cc678 100644 --- a/client/ui/qml/Pages2/PageHome.qml +++ b/client/ui/qml/Pages2/PageHome.qml @@ -134,8 +134,10 @@ PageType { rootButtonImageColor: "#0E0E11" rootButtonBackgroundColor: "#D7D8DB" + rootButtonBackgroundHoveredColor: Qt.rgba(215, 216, 219, 0.8) + rootButtonBackgroundPressedColor: Qt.rgba(215, 216, 219, 0.65) rootButtonHoveredBorderColor: "transparent" - rootButtonPressedBorderColor: "transparent" + rootButtonDefaultBorderColor: "transparent" rootButtonTextTopMargin: 8 rootButtonTextBottomMargin: 8 @@ -304,6 +306,8 @@ PageType { DividerType { Layout.fillWidth: true + Layout.leftMargin: 0 + Layout.rightMargin: 0 } } } diff --git a/client/ui/qml/Pages2/PageSetupWizardEasy.qml b/client/ui/qml/Pages2/PageSetupWizardEasy.qml index 4f94e985..04814c5c 100644 --- a/client/ui/qml/Pages2/PageSetupWizardEasy.qml +++ b/client/ui/qml/Pages2/PageSetupWizardEasy.qml @@ -62,6 +62,7 @@ PageType { id: header implicitWidth: parent.width + headerTextMaximumLineCount: 10 headerText: qsTr("What is the level of internet control in your region?") } @@ -145,14 +146,13 @@ PageType { Item { implicitWidth: 1 - implicitHeight: 1 + implicitHeight: 54 } BasicButtonType { id: continueButton implicitWidth: parent.width - anchors.topMargin: 24 text: qsTr("Continue")