#1233 Added plus button to add card on top of the list

3 files changed, 15 insertions, 12 deletions

diff --git a/client/components/lists/list.styl b/client/components/lists/list.styl
index cf939a6e..5e20476e 100644
--- a/client/components/lists/list.styl
+++ b/client/components/lists/list.styl
@@ -69,13 +69,16 @@
     padding-left: 10px
     color: #a6a6a6
 
-  .list-header-menu-icon
+  .list-header-menu
     position: absolute
     padding: 7px
     margin-top: 1px
     top: -@padding
     right: -@padding
 
+  .list-header-plus-icon
+    color: #a6a6a6
+
 .list-body
   flex: 1
   display: flex
diff --git a/client/components/lists/listHeader.jade b/client/components/lists/listHeader.jade
index 11905586..68336320 100644
--- a/client/components/lists/listHeader.jade
+++ b/client/components/lists/listHeader.jade
@@ -13,7 +13,9 @@ template(name="listHeader")
       if currentUser.isBoardMember
         if isWatching
           i.list-header-watch-icon.fa.fa-eye
-        a.list-header-menu-icon.fa.fa-navicon.js-open-list-menu
+        div.list-header-menu
+          a.js-add-card.fa.fa-plus.list-header-plus-icon
+          a.fa.fa-navicon.js-open-list-menu
 
 template(name="editListTitleForm")
   .list-composer
@@ -28,10 +30,9 @@ template(name="listActionPopup")
   unless currentUser.isCommentOnly
     hr
     ul.pop-over-list
-      li: a.js-add-card {{_ 'add-card'}}
       if cards.count
         li: a.js-select-cards {{_ 'list-select-cards'}}
-    hr
+        hr
     ul.pop-over-list
       li: a.js-close-list {{_ 'archive-list'}}
     hr
diff --git a/client/components/lists/listHeader.js b/client/components/lists/listHeader.js
index 1ad9f9dd..7fe42884 100644
--- a/client/components/lists/listHeader.js
+++ b/client/components/lists/listHeader.js
@@ -24,6 +24,13 @@ BlazeComponent.extendComponent({
   events() {
     return [{
       'click .js-open-list-menu': Popup.open('listAction'),
+      'click .js-add-card' () {
+        const listDom = document.getElementById(`js-list-${this.currentData()._id}`);
+        const listComponent = BlazeComponent.getComponentForElement(listDom);
+        listComponent.openForm({
+          position: 'top',
+        });
+      },
       submit: this.editTitle,
     }];
   },
@@ -36,14 +43,6 @@ Template.listActionPopup.helpers({
 });
 
 Template.listActionPopup.events({
-  'click .js-add-card' () {
-    const listDom = document.getElementById(`js-list-${this._id}`);
-    const listComponent = BlazeComponent.getComponentForElement(listDom);
-    listComponent.openForm({
-      position: 'top',
-    });
-    Popup.close();
-  },
   'click .js-list-subscribe' () {},
   'click .js-select-cards' () {
     const cardIds = this.allCards().map((card) => card._id);