From 1063da0ed1c82e9bf9892d8e2f1b966f6fb2070c Mon Sep 17 00:00:00 2001 From: Bruno Windels Date: Tue, 3 Sep 2019 08:27:45 +0000 Subject: [PATCH] Revert "New composer: show markdown legend on focus" --- res/css/views/rooms/_SendMessageComposer.scss | 30 ++----------------- .../views/rooms/BasicMessageComposer.js | 10 ++----- .../views/rooms/SendMessageComposer.js | 22 -------------- 3 files changed, 4 insertions(+), 58 deletions(-) diff --git a/res/css/views/rooms/_SendMessageComposer.scss b/res/css/views/rooms/_SendMessageComposer.scss index d6da1b87fa..d20f7107b3 100644 --- a/res/css/views/rooms/_SendMessageComposer.scss +++ b/res/css/views/rooms/_SendMessageComposer.scss @@ -30,7 +30,7 @@ limitations under the License. flex-direction: column; // min-height at this level so the mx_BasicMessageComposer_input // still stays vertically centered when less than 50px - min-height: 42px; + min-height: 50px; .mx_BasicMessageComposer_input { padding: 3px 0; @@ -38,7 +38,7 @@ limitations under the License. // in it's parent vertically // while keeping the autocomplete at the top // of the composer. The parent needs to be a flex container for this to work. - margin: auto 0 0 0; + margin: auto 0; // max-height at this level so autocomplete doesn't get scrolled too max-height: 140px; overflow-y: auto; @@ -49,31 +49,5 @@ limitations under the License. position: relative; height: 0; } - - .mx_SendMessageComposer_legend { - height: 16px; - box-sizing: content-box; - font-size: 8px; - line-height: 10px; - padding: 0 0 2px 0; - color: $light-fg-color; - user-select: none; - visibility: hidden; - - * { - display: inline-block; - margin: 0 10px 0 0; - padding: 1px; - } - - code { - border-radius: 2px; - background-color: $focus-bg-color; - } - - &.mx_SendMessageComposer_legend_shown { - visibility: visible; - } - } } diff --git a/src/components/views/rooms/BasicMessageComposer.js b/src/components/views/rooms/BasicMessageComposer.js index 9256bb9a0e..c5661e561c 100644 --- a/src/components/views/rooms/BasicMessageComposer.js +++ b/src/components/views/rooms/BasicMessageComposer.js @@ -226,21 +226,15 @@ export default class BasicMessageEditor extends React.Component { return this.getCaret().offset === this._lastTextLength; } - _onBlur = (event) => { + _onBlur = () => { document.removeEventListener("selectionchange", this._onSelectionChange); - if (this.props.onBlur) { - this.props.onBlur(event); - } } - _onFocus = (event) => { + _onFocus = () => { document.addEventListener("selectionchange", this._onSelectionChange); // force to recalculate this._lastSelection = null; this._refreshLastCaretIfNeeded(); - if (this.props.onFocus) { - this.props.onFocus(event); - } } _onSelectionChange = () => { diff --git a/src/components/views/rooms/SendMessageComposer.js b/src/components/views/rooms/SendMessageComposer.js index 4bb311dfd1..666d2da971 100644 --- a/src/components/views/rooms/SendMessageComposer.js +++ b/src/components/views/rooms/SendMessageComposer.js @@ -33,7 +33,6 @@ import sdk from '../../../index'; import Modal from '../../../Modal'; import { _t } from '../../../languageHandler'; import ContentMessages from '../../../ContentMessages'; -import classNames from "classnames"; function addReplyToMessageContent(content, repliedToEvent, permalinkCreator) { const replyContent = ReplyThread.makeReplyMixIn(repliedToEvent); @@ -88,7 +87,6 @@ export default class SendMessageComposer extends React.Component { constructor(props, context) { super(props, context); - this.state = {}; this.model = null; this._editorRef = null; this.currentlyComposedEditorState = null; @@ -332,18 +330,7 @@ export default class SendMessageComposer extends React.Component { } } - _onFocus = () => { - this.setState({focused: true}); - } - - _onBlur = () => { - this.setState({focused: false}); - } - render() { - const legendClasses = classNames("mx_SendMessageComposer_legend", { - "mx_SendMessageComposer_legend_shown": this.state.focused, - }); return (
@@ -356,16 +343,7 @@ export default class SendMessageComposer extends React.Component { label={this.props.placeholder} placeholder={this.props.placeholder} onChange={this._saveStoredEditorState} - onFocus={this._onFocus} - onBlur={this._onBlur} /> -
- **bold** - _italic_ - <del>strikethrough</del> - `code` - > quote -
); }