minor ui fixes

amnezia-vpn · Oct 2, 2023 · 4e6c109 · 4e6c109
1 parent ed1afa7
commit 4e6c109
Show file tree

Hide file tree

Showing 11 changed files with 53 additions and 33 deletions.
diff --git 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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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")
-Original file line number
+Diff line change
@@ Expand Up / @@ -167,7 +167,7 @@ Item { @@
             }
             onEntered: {
-                backgroud.border.color =  getBackgroundBorderColor(bgBorderHoveredColor)
+                backgroud.border.color = getBackgroundBorderColor(bgBorderHoveredColor)
             }
@@ Expand Down @@