added hovering effect of button

client/ui/qml/Components/ShareConnectionDrawer.qml

@@ -31,7 +31,7 @@ Drawer2Type {
     height: parent.height
     contentHeight: parent.height * 0.9
 
-    onClosed: {
+    onDrawerClosed: {
         configExtension = ".vpn"
         configCaption = qsTr("Save AmneziaVPN config")
         configFileName = "amnezia_config"

client/ui/qml/Controls2/Drawer2Type.qml

@@ -22,6 +22,11 @@ Item {
     }
 
     signal drawerClosed
+    signal collapsedEntered
+    signal collapsedExited
+    signal collapsedEnter
+    signal collapsedPressChanged
+
 
     visible: false
 
@@ -41,6 +46,7 @@ Item {
     property int collapsedHeight: 0
 
     property bool fullMouseAreaVisible: true
+    property MouseArea drawerDragArea: dragArea
 
     state: "closed"
 
@@ -165,6 +171,18 @@ Item {
                         root.state = "expanded"
                     }
                 }
+
+                onExited: {
+                    collapsedExited()
+                }
+
+                onEntered: {
+                    collapsedEnter()
+                }
+
+                onPressedChanged: {
+                    collapsedPressChanged()
+                }
             }
         }
 
@@ -306,7 +324,6 @@ Item {
     }
 
     function open() {
-        //if (root.visible && !root.closed()) {
         if (root.opened()) {
             return
         }
@@ -341,6 +358,11 @@ Item {
         root.state = "collapsed"
     }
 
+    function expand() {
+        draw2Background.color = "#90000000"
+        root.state = "expanded"
+    }
+
 
     function visibledMouseArea(visbile) {
         fullMouseArea.visible = visbile
@@ -374,14 +396,6 @@ Item {
 
                 close()
             }
-
-            if (root.expanded()) {
-                if (needCloseButton) {
-                    PageController.drawerClose()
-                }
-
-                collapse()
-            }
         }
     }
 }

client/ui/qml/Pages2/PageHome.qml

@@ -122,7 +122,7 @@ PageType {
 
 
         ColumnLayout {
-            id: content
+            id: collapsedButtonContent
 
             parent: buttonContent.contentParent
 
@@ -178,6 +178,12 @@ PageType {
                             PropertyAnimation { duration: 200 }
                         }
                     }
+
+                    onClicked: {
+                        if (buttonContent.collapsed()) {
+                            buttonContent.expand()
+                        }
+                    }
                 }
             }
 
@@ -424,5 +430,22 @@ PageType {
                 }
             }
         }
+
+        onCollapsedEnter: {
+            collapsedButtonChevron.backgroundColor = collapsedButtonChevron.hoveredColor
+            collapsedButtonHeader.opacity = 0.8
+        }
+
+        onCollapsedExited: {
+            collapsedButtonChevron.backgroundColor = collapsedButtonChevron.defaultColor
+            collapsedButtonHeader.opacity = 1
+        }
+
+        onCollapsedPressChanged: {
+            collapsedButtonChevron.backgroundColor = buttonContent.drawerDragArea.pressed ?
+                        collapsedButtonChevron.pressedColor : buttonContent.drawerDragArea.entered ?
+                            collapsedButtonChevron.hoveredColor : collapsedButtonChevron.defaultColor
+            collapsedButtonHeader.opacity = 0.7
+        }
     }
 }