Merge pull request #628 from mattermost/mm-2127

MM-2127 Added send icon button to create post control for mobile view.

web/react/components/create_post.jsx

@@ -315,6 +315,7 @@ export default class CreatePost extends React.Component {
             >
                 <div className='post-create'>
                     <div className='post-create-body'>
+                        <div className='post-body__cell'>
                             <Textbox
                                 onUserInput={this.handleUserInput}
                                 onKeyPress={this.postMsgKeyPress}
@@ -335,6 +336,13 @@ export default class CreatePost extends React.Component {
                                 channelId=''
                             />
                         </div>
+                        <a
+                            className='send-button theme'
+                            onClick={this.handleSubmit}
+                        >
+                            <i className='fa fa-paper-plane' />
+                        </a>
+                    </div>
                     <div className={postFooterClassName}>
                         {postError}
                         {serverError}

web/sass-files/sass/partials/_post.scss

@@ -188,6 +188,25 @@ body.ios {
 		max-width: 850px;
 		padding: 0 0 2px;
 		position: relative;
+		.post-body__cell {
+			vertical-align: top;
+			position: relative;
+		}
+		.send-button {
+			display: none;
+			cursor: pointer;
+			padding-right: 4px;
+			width: 45px;
+			height: 37px;
+			font-size: 18px;
+			line-height: 37px;
+			vertical-align: top;
+			text-align: center;
+			@include single-transition(all, 0.15s);
+			&:active {
+				@include opacity(0.75);
+			}
+		}
 		.custom-textarea {
 			padding-top: 8px;
 			padding-right: 28px;

web/sass-files/sass/partials/_responsive.scss

@@ -409,9 +409,22 @@
             }
         }
     }
-    #post-create {
+    .post-create__container {
+        form {
+            padding: 0;
+        }
         .post-create-body {
             padding-bottom: 10px;
+            display: table;
+            width: 100%;
+            table-layout: fixed;
+            .post-body__cell {
+                display: table-cell;
+                padding-left: 1em;
+            }
+            .send-button {
+                display: table-cell;
+            }
         }
         .post-create-footer .msg-typing {
             display: none;