diff --git a/ui/app/img/format-text-bold.svg b/ui/app/img/format-text-bold.svg new file mode 100644 index 0000000000..4ea39c285f --- /dev/null +++ b/ui/app/img/format-text-bold.svg @@ -0,0 +1,3 @@ + + + diff --git a/ui/app/img/format-text-code.svg b/ui/app/img/format-text-code.svg new file mode 100644 index 0000000000..bfba8bf5fa Binary files /dev/null and b/ui/app/img/format-text-code.svg differ diff --git a/ui/app/img/format-text-italic.svg b/ui/app/img/format-text-italic.svg new file mode 100644 index 0000000000..aab9090476 --- /dev/null +++ b/ui/app/img/format-text-italic.svg @@ -0,0 +1,3 @@ + + + diff --git a/ui/app/img/format-text-strike-through.svg b/ui/app/img/format-text-strike-through.svg new file mode 100644 index 0000000000..159b32865f --- /dev/null +++ b/ui/app/img/format-text-strike-through.svg @@ -0,0 +1,3 @@ + + + diff --git a/ui/shared/status/StatusChatInput.qml b/ui/shared/status/StatusChatInput.qml index 76e2715bcc..a65a813326 100644 --- a/ui/shared/status/StatusChatInput.qml +++ b/ui/shared/status/StatusChatInput.qml @@ -1,6 +1,6 @@ import QtQuick 2.13 import QtQuick.Controls 2.13 -import QtGraphicalEffects 1.12 +import QtGraphicalEffects 1.13 import QtQuick.Layouts 1.13 import QtMultimedia 5.13 import QtQuick.Dialogs 1.3 @@ -678,6 +678,45 @@ Rectangle { color: "transparent" } selectionColor: Style.current.primarySelectionColor + persistentSelection: true + onReleased: function (event) { + if (messageInputField.selectedText.trim() !== "") { + let x = event.x - (textFormatMenu.width / 2) + textFormatMenu.popup(x, -messageInputField.height-2) + } + } + + StatusTextFormatMenu { + id: textFormatMenu + Action { + icon.name: "format-text-bold" + icon.width: 12 + icon.height: 16 + onTriggered: wrapSelection("**") + text: qsTr("Bold") + } + Action { + icon.name: "format-text-italic" + icon.width: 12 + icon.height: 16 + onTriggered: wrapSelection("*") + text: qsTr("Italic") + } + Action { + icon.name: "format-text-strike-through" + icon.width: 20 + icon.height: 18 + onTriggered: wrapSelection("~~") + text: qsTr("Strikethrough") + } + Action { + icon.name: "format-text-code" + icon.width: 20 + icon.height: 18 + onTriggered: wrapSelection("`") + text: qsTr("Code") + } + } } Action { shortcut: StandardKey.Bold diff --git a/ui/shared/status/StatusTextFormatMenu.qml b/ui/shared/status/StatusTextFormatMenu.qml new file mode 100644 index 0000000000..9a940b4612 --- /dev/null +++ b/ui/shared/status/StatusTextFormatMenu.qml @@ -0,0 +1,78 @@ +import QtQuick 2.13 +import QtQuick.Controls 2.13 +import QtGraphicalEffects 1.13 +import QtQuick.Layouts 1.13 +import QtQuick.Dialogs 1.3 +import "../../imports" +import "./" + +Menu { + id: root + width: 132 + height: 36 + + onClosed: { + messageInputField.deselect() + } + + background: Item { + id: menuBackground + Rectangle { + id: menuBackgroundContent + implicitWidth: menuBackground.width + implicitHeight: menuBackground.height + color: Style.current.modalBackground + radius: Style.current.radius + layer.enabled: true + layer.effect: DropShadow{ + width: menuBackgroundContent.width + height: menuBackgroundContent.height + x: menuBackgroundContent.x + visible: menuBackgroundContent.visible + source: menuBackgroundContent + horizontalOffset: 0 + verticalOffset: 4 + radius: 12 + samples: 25 + spread: 0.2 + color: "#22000000" + } + } + } + + contentItem: Item { + width: root.width + height: root.height + Row { + anchors.verticalCenter: parent.verticalCenter + anchors.horizontalCenter: parent.horizontalCenter + Repeater { + model: root.contentModel + } + } + } + + delegate: MenuItem { + id: menuItem + width: 32 + height: 32 + leftPadding: 0 + topPadding: 0 + action: Action {} + contentItem: Item { + StatusIconButton { + icon.name: menuItem.action.icon.name + icon.width: menuItem.action.icon.width + icon.height: menuItem.action.icon.height + onClicked: menuItem.action.trigger() + StatusToolTip { + visible: parent.hovered + text: menuItem.action.text + } + } + } + background: Rectangle { + color: "transparent" + } + } +}