FIX: Some iPad fixes for the new composer

app/assets/javascripts/discourse/views/composer.js.es6

@@ -22,8 +22,13 @@ const ComposerView = Ember.View.extend(Ember.Evented, {
   },
 
   movePanels(sizePx) {
-    $('#main-outlet').css('padding-bottom', sizePx);
+
-    $('.composer-popup').css('bottom', sizePx);
+    // Do we need these anymore? causes issues on iPad. Reply sometimes does not
+    // show composer due to bottom padding.
+
+    // $('#main-outlet').css('padding-bottom', sizePx);
+    // $('.composer-popup').css('bottom', sizePx);
+
     // signal the progress bar it should move!
     this.appEvents.trigger("composer:resized");
   },

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

@@ -38,11 +38,28 @@
   }
 }
 
-.d-editor-textarea-wrapper .spinner {
+#reply-control {
+  .d-editor-textarea-wrapper .spinner {
     z-index: 1000;
     margin-top: 5em;
+  }
+
+  .d-editor-button-bar {
+    -moz-box-sizing: border-box;
+    box-sizing: border-box;
+
+    margin: 0px;
+    padding: 5px;
+    border-bottom: 2px solid dark-light-diff($primary, $secondary, 90%, -60%);
+    height: 33px;
+  }
+
+  textarea {
+    box-shadow: none;
+  }
 }
 
+
 .saving-text .spinner {
   display: inline-block;
   left: 5px;

app/assets/stylesheets/desktop/compose.scss

@@ -430,6 +430,11 @@
     color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%));
     background-color: $secondary;
     z-index: 100;
+    overflow: hidden;
+    width: 50%;
+
+    -moz-box-sizing: border-box;
+    box-sizing: border-box;
 
     button {
       color: dark-light-choose(scale-color($primary, $lightness: 50%), scale-color($secondary, $lightness: 50%));