From 9df5c0e2de0d2a1d3a200bb40a7f39dfa1ef4f56 Mon Sep 17 00:00:00 2001
From: Devin McAllester <devin.mcallester@pnnl.gov>
Date: Tue, 14 Apr 2020 17:05:58 -0700
Subject: Allows for use of checklist on mobile

---
 client/components/cards/checklists.jade | 3 ++-
 client/components/cards/checklists.js   | 2 +-
 client/components/cards/checklists.styl | 5 ++++-
 3 files changed, 7 insertions(+), 3 deletions(-)

(limited to 'client')

diff --git a/client/components/cards/checklists.jade b/client/components/cards/checklists.jade
index 391769e9..1b1e088a 100644
--- a/client/components/cards/checklists.jade
+++ b/client/components/cards/checklists.jade
@@ -88,7 +88,8 @@ template(name="checklistItems")
 template(name='checklistItemDetail')
   .js-checklist-item.checklist-item
     if canModifyCard
-      .check-box.materialCheckBox(class="{{#if item.isFinished }}is-checked{{/if}}")
+      .check-box-container
+        .check-box.materialCheckBox(class="{{#if item.isFinished }}is-checked{{/if}}")
       .item-title.js-open-inlined-form.is-editable(class="{{#if item.isFinished }}is-checked{{/if}}")
         +viewer
           = item.title
diff --git a/client/components/cards/checklists.js b/client/components/cards/checklists.js
index c88fdd82..94d8176b 100644
--- a/client/components/cards/checklists.js
+++ b/client/components/cards/checklists.js
@@ -250,7 +250,7 @@ BlazeComponent.extendComponent({
   events() {
     return [
       {
-        'click .js-checklist-item .check-box': this.toggleItem,
+        'click .js-checklist-item .check-box-container': this.toggleItem,
       },
     ];
   },
diff --git a/client/components/cards/checklists.styl b/client/components/cards/checklists.styl
index 8ac37a15..0a6d688b 100644
--- a/client/components/cards/checklists.styl
+++ b/client/components/cards/checklists.styl
@@ -113,6 +113,9 @@ textarea.js-add-checklist-item, textarea.js-edit-checklist-item
   &:hover
     background-color: darken(white, 8%)
 
+  .check-box-container
+    padding-right: 1px;
+
   .check-box
     margin: 0.1em 0 0 0;
     &.is-checked
@@ -121,7 +124,7 @@ textarea.js-add-checklist-item, textarea.js-edit-checklist-item
 
   .item-title
     flex: 1
-    padding-left: 10px;
+    margin-left: 10px;
     &.is-checked
       color: #8c8c8c
       font-style: italic
-- 
cgit v1.2.3-1-g7c22