At opened card, toggle to show checklist at minicard. Part 1.

Thanks to xet7 !

client/components/cards/checklists.css

@@ -8,6 +8,17 @@ textarea.js-edit-checklist-item {
   resize: none;
   height: 34px;
 }
+.text-show-at-minicard {
+  width: 350px;
+  text-align: left;
+}
+.text-some-space {
+  width: 20px;
+}
+.text-hide-checked-items {
+  width: 400px;
+  text-align: left;
+}
 .delete-text,
 .js-delete-checklist-item,
 .js-convert-checklist-item-to-card {

client/components/cards/checklists.jade

@@ -10,8 +10,20 @@ template(name="checklists")
           a.add-checklist-top.js-open-inlined-form(title="{{_ 'add-checklist'}}")
             i.fa.fa-plus
     if currentUser.isBoardMember
+      span.text-show-at-minicard
+        | {{_ 'show-at-minicard'}}
+      .material-toggle-switch(title="{{_ 'show-checklist-at-minicard'}}")
+        if showChecklistAtMinicard
+          input.toggle-switch(type="checkbox" id="toggleShowChecklistAtMinicardButton" checked="checked")
+        else
+          input.toggle-switch(type="checkbox" id="toggleShowChecklistAtMinicardButton")
+        label.toggle-label(for="toggleShowChecklistAtMinicardButton")
+      span.text-some-space
+      span.text-hide-checked-items
+        | {{_ 'hide-checked-items'}}
       .material-toggle-switch(title="{{_ 'hide-checked-items'}}")
         //span.toggle-switch-title
+        //.check-square-icon.i.fa.fa-check-square-o
         if hideCheckedItems
           input.toggle-switch(type="checkbox" id="toggleHideCheckedItemsButton" checked="checked")
         else

client/components/cards/checklists.js

@@ -202,6 +202,9 @@ BlazeComponent.extendComponent({
 
   events() {
     const events = {
+      'click #toggleShowChecklistAtMinicardButton'() {
+        Meteor.call('toggleShowChecklistAtMinicard');
+      },
       'click #toggleHideCheckedItemsButton'() {
         Meteor.call('toggleHideCheckedItems');
       },