JavaScriptExample
diff --git a/‎src/components/views/context_menus/MessageContextMenu.js
Lines changed: 15 additions & 0 deletions b/‎src/components/views/context_menus/MessageContextMenu.js
Lines changed: 15 additions & 0 deletions
diff --git a/‎src/skins/vector/css/matrix-react-sdk/views/rooms/MessageComposer.css
Lines changed: 36 additions & 6 deletions b/‎src/skins/vector/css/matrix-react-sdk/views/rooms/MessageComposer.css
Lines changed: 36 additions & 6 deletions
diff --git a/‎src/skins/vector/img/button-md-false.png
569 Bytes b/‎src/skins/vector/img/button-md-false.png
569 Bytes
diff --git a/‎src/skins/vector/img/button-md-false.svg
Lines changed: 29 additions & 0 deletions b/‎src/skins/vector/img/button-md-false.svg
Lines changed: 29 additions & 0 deletions
diff --git a/‎src/skins/vector/img/button-md-false@2x.png
1.06 KB b/‎src/skins/vector/img/button-md-false@2x.png
1.06 KB
diff --git a/‎src/skins/vector/img/button-md-false@3x.png
1.51 KB b/‎src/skins/vector/img/button-md-false@3x.png
1.51 KB
diff --git a/‎src/skins/vector/img/button-md-true.png
483 Bytes b/‎src/skins/vector/img/button-md-true.png
483 Bytes
diff --git a/‎src/skins/vector/img/button-md-true.svg
Lines changed: 14 additions & 0 deletions b/‎src/skins/vector/img/button-md-true.svg
Lines changed: 14 additions & 0 deletions
diff --git a/‎src/skins/vector/img/button-md-true@2x.png
906 Bytes b/‎src/skins/vector/img/button-md-true@2x.png
906 Bytes
diff --git a/‎src/skins/vector/img/button-md-true@3x.png
1.17 KB b/‎src/skins/vector/img/button-md-true@3x.png
1.17 KB
diff --git a/‎src/skins/vector/img/button-text-strike-o-n.svg
Lines changed: 18 additions & 0 deletions b/‎src/skins/vector/img/button-text-strike-o-n.svg
Lines changed: 18 additions & 0 deletions
diff --git a/‎src/skins/vector/img/icon-text-cancel.svg
Lines changed: 15 additions & 0 deletions b/‎src/skins/vector/img/icon-text-cancel.svg
Lines changed: 15 additions & 0 deletions
@@ -84,6 +84,14 @@ module.exports = React.createClass({
         if (this.props.onFinished) this.props.onFinished();
     },
 
+    onQuoteClick: function () {
+        console.log(this.props.mxEvent);
+        dis.dispatch({
+            action: 'quote',
+            event: this.props.mxEvent,
+        });
+    },
+
     render: function() {
         var eventStatus = this.props.mxEvent.status;
         var resendButton;
@@ -141,6 +149,12 @@ module.exports = React.createClass({
             </div>
         );
 
+        const quoteButton = (
+            <div className="mx_MessageContextMenu_field" onClick={this.onQuoteClick}>
+                Quote
+            </div>
+        );
+
         return (
             <div>
                 {resendButton}
@@ -149,6 +163,7 @@ module.exports = React.createClass({
                 {viewSourceButton}
                 {unhidePreviewButton}
                 {permalinkButton}
+                {quoteButton}
             </div>
         );
     }
 
@@ -57,11 +57,10 @@ limitations under the License.
 .mx_MessageComposer_input {
     flex: 1;
     vertical-align: middle;
-    min-height: 60px;
-    max-height: 120px;
     display: flex;
-    align-items: center;
-    overflow: auto;
+    flex-direction: column;
+    min-height: 60px;
+    align-items: flex-start;
     font-size: 14px;
     margin-right: 6px;
 }
@@ -71,7 +70,17 @@ limitations under the License.
 }
 
 .mx_MessageComposer_input .DraftEditor-root {
+    width: 100%;
     flex: 1;
+    max-height: 120px;
+    overflow: auto;
+}
+
+.mx_MessageComposer_input blockquote {
+    color: rgb(119, 119, 119);
+    margin: 0 0 16px;
+    padding: 0 15px;
+    border-left: 4px solid rgb(221, 221, 221);
 }
 
 .mx_MessageComposer_input textarea {
@@ -89,7 +98,8 @@ limitations under the License.
     color: #454545;
     background-color: #fff;
     font-size: 14px;
-
+    max-height: 120px;
+    overflow: auto;
     /* needed for FF */
     font-family: 'Open Sans', Arial, Helvetica, Sans-Serif;
 }
@@ -123,6 +133,11 @@ limitations under the License.
     pointer-events: none;
 }
 
+.mx_MessageComposer_formatting {
+    cursor: pointer;
+    margin: 0 11px;
+}
+
 .mx_MessageComposer_formatbar {
     display: flex;
 
@@ -142,6 +157,21 @@ limitations under the License.
     margin-right: 4px;
 }
 
-.mx_MessageComposer_format_button {
+.mx_MessageComposer_format_button,
+.mx_MessageComposer_formatbar_cancel,
+.mx_MessageComposer_formatbar_markdown {
     cursor: pointer;
 }
+
+.mx_MessageComposer_formatbar_cancel {
+    margin-right: 22px;
+}
+
+.mx_MessageComposer_formatbar_markdown {
+    margin-right: 64px;
+}
+
+.mx_MessageComposer_input_markdownIndicator {
+    padding: 4px 4px 4px 0;
+    opacity: 0.8;
+}