added DropDown component

client/images/controls/chevron-down.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M6 9L12 15L18 9" stroke="#CBCBCB" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

client/images/controls/chevron-up.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M18 15L12 9L6 15" stroke="#CBCBCB" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

client/resources.qrc

@@ -196,5 +196,7 @@
         <file>images/controls/arrow-left.svg</file>
         <file>ui/qml/Pages2/PageSetupWizardProtocols.qml</file>
         <file>ui/qml/Pages2/PageSetupWizardEasy.qml</file>
+        <file>images/controls/chevron-down.svg</file>
+        <file>images/controls/chevron-up.svg</file>
     </qresource>
 </RCC>

client/ui/pages.h

@@ -26,7 +26,7 @@ enum class Page {Start = 0, NewServer, NewServerProtocols, Vpn,
            GeneralSettings, AppSettings, NetworkSettings, ServerSettings,
            ServerContainers, ServersList, ShareConnection,  Sites,
            ProtocolSettings, ProtocolShare, QrDecoder, QrDecoderIos, About, ViewConfig,
-           AdvancedServerSettings, ClientManagement, ClientInfo
+           AdvancedServerSettings, ClientManagement, ClientInfo,
 
            Test, WizardCredentials, WizardProtocols, WizardEasySetup};
 Q_ENUM_NS(Page)

client/ui/qml/Controls2/CardType.qml

@@ -111,7 +111,6 @@ RadioButton {
         Text {
             text: root.footerText
             visible: root.footerText !== ""
-            enabled: root.footerText !== ""
             color: "#878B91"
             font.pixelSize: 13
             font.weight: 400

client/ui/qml/Controls2/DropDownType.qml

@@ -1,5 +1,227 @@
 import QtQuick
+import QtQuick.Controls
+import QtQuick.Layouts
 
 Item {
+    id: root
 
+    property string text
+    property string descriptionText
+
+    property var onClickedFunc
+    property string buttonImage: "qrc:/images/controls/chevron-down.svg"
+
+    property string defaultColor: "#1C1D21"
+
+    property string borderColor: "#494B50"
+
+    property alias menuModel: menuContent.model
+
+    width: buttonContent.implicitWidth
+    height: buttonContent.implicitHeight
+
+    Rectangle {
+        id: buttonBackground
+        anchors.fill: buttonContent
+
+        radius: 16
+        color: defaultColor
+        border.color: borderColor
+
+        Behavior on border.width {
+            PropertyAnimation { duration: 200 }
+        }
+    }
+
+    RowLayout {
+        id: buttonContent
+        anchors.fill: parent
+        anchors.rightMargin: 16
+        anchors.leftMargin: 16
+
+        ColumnLayout {
+            Layout.leftMargin: 16
+            Layout.rightMargin: 16
+            Layout.topMargin: 16
+            Layout.bottomMargin: 16
+
+            Text {
+                visible: root.descriptionText !== ""
+
+                font.family: "PT Root UI"
+                font.styleName: "normal"
+                font.pixelSize: 13
+                font.letterSpacing: 0.02
+                color: "#878B91"
+                text: root.descriptionText
+                wrapMode: Text.WordWrap
+
+                Layout.fillWidth: true
+                height: 16   
+
+                horizontalAlignment: Text.AlignLeft
+                verticalAlignment: Text.AlignVCenter
+            }
+
+            Text {
+                font.family: "PT Root UI"
+                font.styleName: "normal"
+                font.pixelSize: 16
+                color: "#d7d8db"
+                text: root.text
+
+                Layout.fillWidth: true
+                height: 24
+
+                horizontalAlignment: Text.AlignLeft
+                verticalAlignment: Text.AlignVCenter
+            }
+        }
+
+        ImageButtonType {
+            id: button
+
+            Layout.rightMargin: 16
+
+            hoverEnabled: false
+            image: buttonImage
+            onClicked: {
+                if (onClickedFunc && typeof onClickedFunc === "function") {
+                    onClickedFunc()
+                }
+            }
+
+            Layout.alignment: Qt.AlignRight
+        }
+    }
+
+    MouseArea {
+        anchors.fill: parent
+        cursorShape: Qt.PointingHandCursor
+        hoverEnabled: true
+
+        onEntered: {
+            buttonBackground.border.width = 1
+        }
+
+        onExited: {
+            buttonBackground.border.width = 0
+        }
+
+        onClicked: {
+            menu.visible = true
+        }
+    }
+
+    Drawer {
+        id: menu
+
+        edge: Qt.BottomEdge
+        width: parent.width
+        height: parent.height * 0.8
+
+        clip: true
+        modal: true
+
+        background: Rectangle {
+            anchors.fill: parent
+            anchors.bottomMargin: -radius
+            radius: 16
+            color: "#1C1D21"
+        }
+
+        Overlay.modal: Rectangle {
+            color: Qt.rgba(14/255, 14/255, 17/255, 0.8)
+        }
+
+        Column {
+            anchors.top: parent.top
+            anchors.left: parent.left
+            anchors.right: parent.right
+            anchors.topMargin: 16
+
+            spacing: 16
+
+            Header2TextType {
+                width: parent.width
+
+                text: "Данные для подключения"
+                wrapMode: Text.WordWrap
+
+                leftPadding: 16
+                rightPadding: 16
+            }
+
+            ButtonGroup {
+                id: radioButtonGroup
+            }
+
+            ListView {
+                id: menuContent
+                width: parent.width
+                height: menuContent.contentItem.height
+
+                currentIndex: -1
+
+                clip: true
+                interactive: false
+
+                delegate: Item {
+                    implicitWidth: menuContent.width
+                    implicitHeight: radioButton.implicitHeight
+
+                    RadioButton {
+                        id: radioButton
+
+                        implicitWidth: parent.width
+                        implicitHeight: radioButtonContent.implicitHeight
+
+                        hoverEnabled: true
+
+                        ButtonGroup.group: radioButtonGroup
+
+                        indicator: Rectangle {
+                            anchors.fill: parent
+                            color: radioButton.hovered ? "#2C2D30" : "#1C1D21"
+                        }
+
+                        RowLayout {
+                            id: radioButtonContent
+                            anchors.fill: parent
+
+                            anchors.rightMargin: 16
+                            anchors.leftMargin: 16
+
+                            z: 1
+
+                            Text {
+                                id: text
+
+                                text: modelData
+                                color: "#D7D8DB"
+                                font.pixelSize: 16
+                                font.weight: 400
+                                font.family: "PT Root UI VF"
+
+                                height: 24
+
+                                Layout.fillWidth: true
+                                Layout.topMargin: 20
+                                Layout.bottomMargin: 20
+                            }
+
+                            Image {
+                                source: "qrc:/images/controls/check.svg"
+                                visible: radioButton.checked
+                                width: 24
+                                height: 24
+
+                                Layout.rightMargin: 8
+                            }
+                        }
+                    }
+                }
+            }
+        }
+    }
 }

client/ui/qml/Controls2/FlickableType.qml

@@ -9,8 +9,8 @@ Flickable {
     width: parent.width
 
     anchors.bottom: parent.bottom
-    anchors.left: root.left
+    anchors.left: parent.left
-    anchors.right: root.right
+    anchors.right: parent.right
     anchors.rightMargin: 1
 
     Keys.onUpPressed: scrollBar.decrease()

client/ui/qml/Controls2/LabelWithButtonType.qml

@@ -9,7 +9,7 @@ Item {
     property string descriptionText
 
     property var onClickedFunc
-    property alias buttonImage : button.image
+    property alias buttonImage: button.image
 
     implicitWidth: content.implicitWidth
     implicitHeight: content.implicitHeight
@@ -42,6 +42,8 @@ Item {
                 text: root.descriptionText
                 wrapMode: Text.WordWrap
 
+                visible: root.descriptionText !== ""
+
                 Layout.fillWidth: true
                 height: 16
 

client/ui/qml/Pages2/PageStart.qml

@@ -79,18 +79,37 @@ PageBase {
 //                    UiLogic.goToPage(PageEnum.Start)
 //                }
             }
+
+            DropDownType {
+                Layout.fillWidth: true
+
+                text: "IP, логин и пароль от сервера"
+                descriptionText: "IP, логин и пароль от сервера"
+
+                menuModel: [
+                    qsTr("SHA512"),
+                    qsTr("SHA384"),
+                    qsTr("SHA256"),
+                    qsTr("SHA3-512"),
+                    qsTr("SHA3-384"),
+                    qsTr("SHA3-256"),
+                    qsTr("whirlpool"),
+                    qsTr("BLAKE2b512"),
+                    qsTr("BLAKE2s256"),
+                    qsTr("SHA1")
+                ]
+            }
         }
 
         Drawer {
             id: drawer
 
-            y: 0
-            x: 0
             edge: Qt.BottomEdge
             width: parent.width
             height: parent.height * 0.4375
 
             clip: true
+            modal: true
 
             background: Rectangle {
                 anchors.fill: parent
@@ -99,15 +118,9 @@ PageBase {
                 color: "#1C1D21"
             }
 
-            modal: true
+            Overlay.modal: Rectangle {
-            //interactive: activeFocus
+                color: Qt.rgba(14/255, 14/255, 17/255, 0.8)
-
+            }
-//            onAboutToHide: {
-//                pageLoader.focus = true
-//            }
-//            onAboutToShow: {
-//                tfSshLog.focus = true
-//            }
 
             ColumnLayout {
                 anchors.top: parent.top

client/ui/qml/main2.qml

@@ -135,7 +135,7 @@ Window  {
         id: pageLoader
 
         onFinished: {
-            UiLogic.initalizeUiLogic()
+            UiLogic.initializeUiLogic()
         }
     }