FIX: layout problems in composer on mobile

app/assets/javascripts/discourse/templates/composer.js.handlebars

@@ -64,8 +64,8 @@
             <div id='wmd-preview' {{bind-attr class="hidePreview:hidden"}}></div>
           </div>
           {{#if currentUser}}
+            <div class="composer-bottom-right">
               <a href="#" {{action togglePreview}} class='toggle-preview'>{{{model.toggleText}}}</a>
-            <div id='draft-status'></div>
               {{#if view.isUploading}}
                 <div id="file-uploading">
                   {{i18n upload_selector.uploading}} {{view.uploadProgress}}% <a id="cancel-file-upload">{{i18n cancel}}</a>
@@ -75,6 +75,8 @@
                   <a {{action showUploadSelector view}} class='mobile-file-upload'>{{i18n upload}}</a>
                 {{/if}}
               {{/if}}
+              <div id='draft-status'></div>
+            </div>
           {{/if}}
         </div>
 

app/assets/stylesheets/common/base/mobile.scss

@@ -15,9 +15,6 @@ and (max-device-width : 540px) {
       .textarea-wrapper {
         width: 100%;
       }
-      .wmd-button-bar {
-        display: none;
-      }
     }
   }
 }

app/assets/stylesheets/mobile/compose.scss

@@ -16,13 +16,20 @@ display: none;
 
 
 #reply-control {
-  .toggle-preview, #draft-status, #file-uploading, .mobile-file-upload {
+  .composer-bottom-right {
     position: absolute;
     bottom: -37px;
+    right: 5px;
     margin-top: 0;
   }
   .toggle-preview, .mobile-file-upload {
-    right: 5px;
+    text-decoration: underline;
+  }
+  .toggle-preview, #draft-status, #file-uploading, .mobile-file-upload {
+    float: right;
+    margin-right: 8px;
+  }
+  .toggle-preview, .mobile-file-upload {
     text-decoration: underline;
   }
   #file-uploading {
@@ -31,7 +38,6 @@ display: none;
     color: scale-color($secondary, $lightness: 50%);
   }
   #draft-status {
-    right: 70px;
     color: scale-color($primary, $lightness: 75%);
     &.flash {
       color: $danger;
@@ -354,10 +360,6 @@ display: none;
     }
   }
   #wmd-button-bar {
-    top: 0;
-    position: absolute;
-    border-bottom: 1px solid scale-color-diff();
-    background-color: $secondary;
-    z-index: 100;
+    display: none;
   }
 }