Browse Source

Revert drag handle changes.

Thanks to Keelan !

Related #2704
Lauri Ojansivu 5 years ago
parent
commit
57119868bb

+ 1 - 1
client/components/boards/boardBody.js

@@ -89,7 +89,7 @@ BlazeComponent.extendComponent({
         helper.append(list.clone());
         return helper;
       },
-      handle: '.js-swimlane-header-handle',
+      handle: '.js-swimlane-header',
       items: '.swimlane:not(.placeholder)',
       placeholder: 'swimlane placeholder',
       distance: 7,

+ 2 - 2
client/components/cards/minicard.jade

@@ -3,8 +3,6 @@ template(name="minicard")
     class="{{#if isLinkedCard}}linked-card{{/if}}"
     class="{{#if isLinkedBoard}}linked-board{{/if}}"
     class="minicard-{{colorClass}}")
-    .handle
-      .fa.fa-arrows
     if cover
       .minicard-cover(style="background-image: url('{{cover.url}}');")
     if labels
@@ -17,6 +15,8 @@ template(name="minicard")
           if hiddenMinicardLabelText
             .minicard-label(class="card-label-{{color}}" title="{{name}}")
     .minicard-title
+      .handle
+        .fa.fa-arrows
       if $eq 'prefix-with-full-path' currentBoard.presentParentTask
         .parent-prefix
           | {{ parentString ' > ' }}

+ 1 - 1
client/components/cards/minicard.styl

@@ -105,7 +105,7 @@
     right: 5px;
     top: 5px;
     display:none;
-    @media only screen {
+    @media only screen and (max-width: 1199px) {
       display:block;
     }
     .fa-arrows

+ 5 - 3
client/components/lists/list.js

@@ -31,9 +31,11 @@ BlazeComponent.extendComponent({
     const itemsSelector = '.js-minicard:not(.placeholder, .js-card-composer)';
     const $cards = this.$('.js-minicards');
 
-    $('.js-minicards').sortable({
-      handle: '.handle',
-    });
+    if (window.matchMedia('(max-width: 1199px)').matches) {
+      $('.js-minicards').sortable({
+        handle: '.handle',
+      });
+    }
 
     $cards.sortable({
       connectWith: '.js-minicards:not(.js-list-full)',

+ 5 - 17
client/components/lists/list.styl

@@ -84,16 +84,17 @@
     padding-left: 10px
     color: #a6a6a6
 
+
   .list-header-menu
     position: absolute
     padding: 27px 19px
     margin-top: 1px
     top: -7px
-    right: 3px
+    right: -7px
 
   .list-header-plus-icon
     color: #a6a6a6
-    margin-right: 15px
+    margin-right: 10px
 
   .highlight
     color: #ce1414
@@ -164,12 +165,7 @@
 
 @media screen and (max-width: 800px)
   .list-header-menu
-    position: absolute
-    padding: 27px 19px
-    margin-top: 1px
-    top: -7px
-    margin-right: 50px
-    right: -3px
+    margin-right: 30px
 
   .mini-list
     flex: 0 0 60px
@@ -225,17 +221,9 @@
       padding: 7px
       top: 50%
       transform: translateY(-50%)
-      margin-right: 27px
+      right: 17px
       font-size: 20px
 
-    .list-header-menu-handle
-      position: absolute
-      padding: 7px
-      top: 50%
-      transform: translateY(-50%)
-      right: 10px
-      font-size: 24px
-
 .link-board-wrapper
   display: flex
   align-items: baseline

+ 0 - 3
client/components/lists/listHeader.jade

@@ -29,10 +29,8 @@ template(name="listHeader")
               if canSeeAddCard
                 a.js-add-card.fa.fa-plus.list-header-plus-icon
               a.fa.fa-navicon.js-open-list-menu
-          a.list-header-menu-handle.handle.fa.fa-arrows.js-list-handle
         else
           a.list-header-menu-icon.fa.fa-angle-right.js-select-list
-          a.list-header-menu-handle.handle.fa.fa-arrows.js-list-handle
       else if currentUser.isBoardMember
         if isWatching
           i.list-header-watch-icon.fa.fa-eye
@@ -41,7 +39,6 @@ template(name="listHeader")
             if canSeeAddCard
               a.js-add-card.fa.fa-plus.list-header-plus-icon
             a.fa.fa-navicon.js-open-list-menu
-          a.list-header-menu-handle.handle.fa.fa-arrows.js-list-handle
 
 template(name="editListTitleForm")
   .list-composer

+ 0 - 1
client/components/swimlanes/swimlaneHeader.jade

@@ -16,7 +16,6 @@ template(name="swimlaneFixedHeader")
     unless currentUser.isCommentOnly
       a.fa.fa-plus.js-open-add-swimlane-menu.swimlane-header-plus-icon
       a.fa.fa-navicon.js-open-swimlane-menu
-      a.swimlane-header-menu-handle.handle.fa.fa-arrows.js-swimlane-header-handle
 
 template(name="editSwimlaneTitleForm")
   .list-composer

+ 2 - 3
client/components/swimlanes/swimlanes.js

@@ -56,7 +56,7 @@ function initSortable(boardComponent, $listsDom) {
   $listsDom.sortable({
     tolerance: 'pointer',
     helper: 'clone',
-    handle: '.js-list-handle',
+    handle: '.js-list-header',
     items: '.js-list:not(.js-list-composer)',
     placeholder: 'list placeholder',
     distance: 7,
@@ -156,8 +156,7 @@ BlazeComponent.extendComponent({
             'input',
             'textarea',
             'p',
-            '.js-list-handle',
-            '.js-swimlane-header-handle',
+            '.js-list-header',
           ];
           if (
             $(evt.target).closest(noDragInside.join(',')).length === 0 &&

+ 0 - 8
client/components/swimlanes/swimlanes.styl

@@ -50,14 +50,6 @@
       margin-left: 5px
       margin-right: 10px
 
-    .swimlane-header-menu-handle
-      position: absolute
-      padding: 7px
-      top: 50%
-      transform: translateY(-50%)
-      left: 300px
-      font-size: 18px
-
 .list-group
   height: 100%