Sept 22 2 (#9067)

* Added show member modal when hero is clicked

* Added drag for checklist and fixed display system messages

* Fixed party modal showing from group page

* Delete new message key

* Adjusted column sizes for chat

* Fixed key

website/client/components/tasks/taskModal.vue

@@ -23,6 +23,7 @@
           br
           div(v-sortable='', @onsort='sortedChecklist')
             .inline-edit-input-group.checklist-group.input-group(v-for="(item, $index) in checklist")
+              span.grippy
               input.inline-edit-input.checklist-item.form-control(type="text", v-model="item.text")
               span.input-group-btn(@click="removeChecklistItem($index)")
                 .svg-icon.destroy-icon(v-html="icons.destroy")
@@ -330,6 +331,30 @@
       border-top: 1px solid $gray-500;
     }
 
+    // From: https://codepen.io/zachariab/pen/wkrbc
+    span.grippy {
+      content: '....';
+      width: 20px;
+      height: 20px;
+      display: inline-block;
+      overflow: hidden;
+      line-height: 5px;
+      padding: 3px 4px;
+      cursor: move;
+      vertical-align: middle;
+      margin-top: .5em;
+      margin-right: .3em;
+      font-size: 12px;
+      font-family: sans-serif;
+      letter-spacing: 2px;
+      color: #cccccc;
+      text-shadow: 1px 0 1px black;
+    }
+
+    span.grippy::after {
+      content: '.. .. .. ..';
+    }
+
     .checklist-item {
       margin-bottom: 0px;
       border-radius: 0px;