diff --git a/client/ui/qml/Controls2/TextAreaType.qml b/client/ui/qml/Controls2/TextAreaType.qml index 4b70c274d..f4f754179 100644 --- a/client/ui/qml/Controls2/TextAreaType.qml +++ b/client/ui/qml/Controls2/TextAreaType.qml @@ -9,71 +9,99 @@ Rectangle { property alias textArea: textArea property alias textAreaText: textArea.text + property string borderHoveredColor: "#494B50" + property string borderNormalColor: "#2C2D30" + property string borderFocusedColor: "#d7d8db" + height: 148 color: "#1C1D21" border.width: 1 - border.color: "#2C2D30" + border.color: getBorderColor(borderNormalColor) radius: 16 - FlickableType { - id: fl - interactive: false + MouseArea { + id: parentMouse + anchors.fill: parent + cursorShape: Qt.IBeamCursor + onClicked: textArea.forceActiveFocus() + hoverEnabled: true + + FlickableType { + id: fl + interactive: false - anchors.top: parent.top - anchors.bottom: parent.bottom - contentHeight: textArea.implicitHeight - TextArea { - id: textArea + anchors.top: parent.top + anchors.bottom: parent.bottom + contentHeight: textArea.implicitHeight + TextArea { + id: textArea - width: parent.width + width: parent.width - topPadding: 16 - leftPadding: 16 - anchors.topMargin: 16 - anchors.bottomMargin: 16 + topPadding: 16 + leftPadding: 16 + anchors.topMargin: 16 + anchors.bottomMargin: 16 - color: "#D7D8DB" - selectionColor: "#633303" - selectedTextColor: "#D7D8DB" - placeholderTextColor: "#878B91" + color: "#D7D8DB" + selectionColor: "#633303" + selectedTextColor: "#D7D8DB" + placeholderTextColor: "#878B91" - font.pixelSize: 16 - font.weight: Font.Medium - font.family: "PT Root UI VF" + font.pixelSize: 16 + font.weight: Font.Medium + font.family: "PT Root UI VF" - placeholderText: root.placeholderText - text: root.text + placeholderText: root.placeholderText + text: root.text - onCursorVisibleChanged: { - if (textArea.cursorVisible) { - fl.interactive = true - } else { - fl.interactive = false + onCursorVisibleChanged: { + if (textArea.cursorVisible) { + fl.interactive = true + } else { + fl.interactive = false + } } - } - wrapMode: Text.Wrap + wrapMode: Text.Wrap - MouseArea { - anchors.fill: parent - acceptedButtons: Qt.RightButton - onClicked: { - fl.interactive = true - contextMenu.open() + MouseArea { + id: textAreaMouse + anchors.fill: parent + acceptedButtons: Qt.RightButton + hoverEnabled: true + onClicked: { + fl.interactive = true + contextMenu.open() + } } - } - ContextMenuType { - id: contextMenu - textObj: textArea + onFocusChanged: { + root.border.color = getBorderColor(borderNormalColor) + } + + ContextMenuType { + id: contextMenu + textObj: textArea + } } } + + onPressed: { + root.border.color = getBorderColor(borderFocusedColor) + } + + onExited: { + root.border.color = getBorderColor(borderNormalColor) + } + + onEntered: { + root.border.color = getBorderColor(borderHoveredColor) + } } - //todo make whole background clickable, with code below we lose ability to select text by mouse -// MouseArea { -// anchors.fill: parent -// cursorShape: Qt.IBeamCursor -// onClicked: textArea.forceActiveFocus() -// } + + function getBorderColor(noneFocusedColor) { + return textArea.focus ? root.borderFocusedColor : noneFocusedColor + } } diff --git a/client/ui/qml/Controls2/TextFieldWithHeaderType.qml b/client/ui/qml/Controls2/TextFieldWithHeaderType.qml index 3f80428ea..3a3f5a1a3 100644 --- a/client/ui/qml/Controls2/TextFieldWithHeaderType.qml +++ b/client/ui/qml/Controls2/TextFieldWithHeaderType.qml @@ -30,6 +30,7 @@ Item { property string backgroundColor: "#1c1d21" property string backgroundDisabledColor: "transparent" + property string bgBorderHoveredColor: "#494B50" implicitWidth: content.implicitWidth implicitHeight: content.implicitHeight @@ -44,7 +45,7 @@ Item { Layout.preferredHeight: input.implicitHeight color: root.enabled ? root.backgroundColor : root.backgroundDisabledColor radius: 16 - border.color: textField.focus ? root.borderFocusedColor : root.borderColor + border.color: getBackgroundBorderColor(root.borderColor) border.width: 1 Behavior on border.color { @@ -102,12 +103,17 @@ Item { anchors.fill: parent acceptedButtons: Qt.RightButton onClicked: contextMenu.open() + enabled: true } ContextMenuType { id: contextMenu textObj: textField } + + onFocusChanged: { + backgroud.border.color = getBackgroundBorderColor(root.borderColor) + } } } @@ -149,11 +155,28 @@ Item { MouseArea { anchors.fill: root - cursorShape: Qt.PointingHandCursor + cursorShape: Qt.IBeamCursor + + hoverEnabled: true onPressed: function(mouse) { textField.forceActiveFocus() mouse.accepted = false + + backgroud.border.color = getBackgroundBorderColor(root.borderColor) + } + + onEntered: { + backgroud.border.color = getBackgroundBorderColor(bgBorderHoveredColor) } + + + onExited: { + backgroud.border.color = getBackgroundBorderColor(root.borderColor) + } + } + + function getBackgroundBorderColor(noneFocusedColor) { + return textField.focus ? root.borderFocusedColor : noneFocusedColor } }