Merge pull request #676 from cmho/274-add-comment-button

[274] Add comment button to comment form where browser has 'Touch' event enabled

resources/assets/js/components.js

@@ -25,6 +25,13 @@ pixelfed.readmore = () => {
   });
 };
 
+try {
+    document.createEvent("TouchEvent");
+    $('body').addClass('touch');
+} catch (e) {
+    return false;
+}
+
 window.InfiniteScroll = require('infinite-scroll');
 window.filesize = require('filesize');
 window.Plyr = require('plyr');

resources/assets/js/components/PostComponent.vue

@@ -156,6 +156,7 @@
               <input type="hidden" name="_token" value="">
               <input type="hidden" name="item" :value="statusId">
               <input class="form-control" name="comment" placeholder="Add a comment..." autocomplete="off">
+              <input type="submit" value="Send" class="btn btn-primary comment-submit" />
             </form>
           </div>
         </div>

resources/assets/sass/custom.scss

@@ -267,6 +267,26 @@ body, button, input, textarea {
 .card {
   box-shadow: 0 2px 6px 0 hsla(0, 0%, 0%, 0.2);
   border: none;
+
+  .comment-submit {
+      display: none;
+      position: absolute;
+      bottom: 12px;
+      right: 20px;
+      width: 60px;
+      text-align: center;
+      border-radius: 0 3px 3px 0;
+  }
+}
+
+.touch .card {
+    input[name="comment"] {
+        padding-right: 70px;
+    }
+
+    .comment-submit {
+        display: block;
+    }
 }
 
 .box-shadow {