summaryrefslogtreecommitdiffstats
path: root/client
diff options
context:
space:
mode:
authorLauri Ojansivu <x@xet7.org>2019-09-13 03:45:55 +0300
committerLauri Ojansivu <x@xet7.org>2019-09-13 03:45:55 +0300
commitff550e91103115e7b731dd80c4588b93b2d4c64f (patch)
tree79316cf93a59b6a8a09e6dc8071d39ec02547d27 /client
parent0fcfc3a34039954a04f2f3549408baaf1dce1b0c (diff)
downloadwekan-ff550e91103115e7b731dd80c4588b93b2d4c64f.tar.gz
wekan-ff550e91103115e7b731dd80c4588b93b2d4c64f.tar.bz2
wekan-ff550e91103115e7b731dd80c4588b93b2d4c64f.zip
Mobile and Desktop drag handles part 1.
Thanks to xet7 ! Related #2081
Diffstat (limited to 'client')
-rw-r--r--client/components/boards/boardBody.js2
-rw-r--r--client/components/cards/minicard.jade4
-rw-r--r--client/components/cards/minicard.styl2
-rw-r--r--client/components/lists/list.js8
-rw-r--r--client/components/lists/list.styl22
-rw-r--r--client/components/lists/listHeader.jade3
-rw-r--r--client/components/swimlanes/swimlaneHeader.jade1
-rw-r--r--client/components/swimlanes/swimlanes.js5
-rw-r--r--client/components/swimlanes/swimlanes.styl8
9 files changed, 39 insertions, 16 deletions
diff --git a/client/components/boards/boardBody.js b/client/components/boards/boardBody.js
index 07cd306a..713b6cbc 100644
--- a/client/components/boards/boardBody.js
+++ b/client/components/boards/boardBody.js
@@ -89,7 +89,7 @@ BlazeComponent.extendComponent({
helper.append(list.clone());
return helper;
},
- handle: '.js-swimlane-header',
+ handle: '.js-swimlane-header-handle',
items: '.swimlane:not(.placeholder)',
placeholder: 'swimlane placeholder',
distance: 7,
diff --git a/client/components/cards/minicard.jade b/client/components/cards/minicard.jade
index 3806ce41..4c166c5c 100644
--- a/client/components/cards/minicard.jade
+++ b/client/components/cards/minicard.jade
@@ -3,6 +3,8 @@ 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
@@ -15,8 +17,6 @@ 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 ' > ' }}
diff --git a/client/components/cards/minicard.styl b/client/components/cards/minicard.styl
index c4172572..9997fd5f 100644
--- a/client/components/cards/minicard.styl
+++ b/client/components/cards/minicard.styl
@@ -105,7 +105,7 @@
right: 5px;
top: 5px;
display:none;
- @media only screen and (max-width: 1199px) {
+ @media only screen {
display:block;
}
.fa-arrows
diff --git a/client/components/lists/list.js b/client/components/lists/list.js
index c2b39be9..650d1295 100644
--- a/client/components/lists/list.js
+++ b/client/components/lists/list.js
@@ -31,11 +31,9 @@ BlazeComponent.extendComponent({
const itemsSelector = '.js-minicard:not(.placeholder, .js-card-composer)';
const $cards = this.$('.js-minicards');
- if (window.matchMedia('(max-width: 1199px)').matches) {
- $('.js-minicards').sortable({
- handle: '.handle',
- });
- }
+ $('.js-minicards').sortable({
+ handle: '.handle',
+ });
$cards.sortable({
connectWith: '.js-minicards:not(.js-list-full)',
diff --git a/client/components/lists/list.styl b/client/components/lists/list.styl
index 81938c1a..459481ea 100644
--- a/client/components/lists/list.styl
+++ b/client/components/lists/list.styl
@@ -84,17 +84,16 @@
padding-left: 10px
color: #a6a6a6
-
.list-header-menu
position: absolute
padding: 27px 19px
margin-top: 1px
top: -7px
- right: -7px
+ right: 3px
.list-header-plus-icon
color: #a6a6a6
- margin-right: 10px
+ margin-right: 15px
.highlight
color: #ce1414
@@ -165,7 +164,12 @@
@media screen and (max-width: 800px)
.list-header-menu
- margin-right: 30px
+ position: absolute
+ padding: 27px 19px
+ margin-top: 1px
+ top: -7px
+ margin-right: 50px
+ right: -3px
.mini-list
flex: 0 0 60px
@@ -221,9 +225,17 @@
padding: 7px
top: 50%
transform: translateY(-50%)
- right: 17px
+ margin-right: 27px
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
diff --git a/client/components/lists/listHeader.jade b/client/components/lists/listHeader.jade
index f930e57a..bbb94445 100644
--- a/client/components/lists/listHeader.jade
+++ b/client/components/lists/listHeader.jade
@@ -29,8 +29,10 @@ 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
@@ -39,6 +41,7 @@ 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
diff --git a/client/components/swimlanes/swimlaneHeader.jade b/client/components/swimlanes/swimlaneHeader.jade
index 8c6aa5a3..e50b3a3f 100644
--- a/client/components/swimlanes/swimlaneHeader.jade
+++ b/client/components/swimlanes/swimlaneHeader.jade
@@ -16,6 +16,7 @@ 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
diff --git a/client/components/swimlanes/swimlanes.js b/client/components/swimlanes/swimlanes.js
index e0857003..81780a71 100644
--- a/client/components/swimlanes/swimlanes.js
+++ b/client/components/swimlanes/swimlanes.js
@@ -56,7 +56,7 @@ function initSortable(boardComponent, $listsDom) {
$listsDom.sortable({
tolerance: 'pointer',
helper: 'clone',
- handle: '.js-list-header',
+ handle: '.js-list-handle',
items: '.js-list:not(.js-list-composer)',
placeholder: 'list placeholder',
distance: 7,
@@ -156,7 +156,8 @@ BlazeComponent.extendComponent({
'input',
'textarea',
'p',
- '.js-list-header',
+ '.js-list-handle',
+ '.js-swimlane-header-handle',
];
if (
$(evt.target).closest(noDragInside.join(',')).length === 0 &&
diff --git a/client/components/swimlanes/swimlanes.styl b/client/components/swimlanes/swimlanes.styl
index 1056e1e3..503091ee 100644
--- a/client/components/swimlanes/swimlanes.styl
+++ b/client/components/swimlanes/swimlanes.styl
@@ -50,6 +50,14 @@
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%