diff options
author | Jacob Schatz <jschatz@gitlab.com> | 2016-06-15 22:50:02 +0300 |
---|---|---|
committer | Robert Speicher <rspeicher@gmail.com> | 2016-06-16 03:59:26 +0300 |
commit | 85f254cec18667b08d28b0eb808af46dc3049d4b (patch) | |
tree | 7b7d4f604975cb31eb3df20d87302d79bdff147c /app/assets | |
parent | 7580597cf36c32f5e063cd3545f2f7c861ac723e (diff) |
Merge branch 'issue_18575' into 'master'
Improve usability for prioritized labels
## What does this MR do?
- Adds an icon next to prioritized label rows serving as a hint to the user that the labels can be sorted by dragging them.
- Adds description about prioritized labels.
- Restores empty message when removing all prioritized labels.
## Screenshots (if relevant)
![labels](/uploads/1da16c4c54a894fa45ccc47e3a5bdf7a/labels.gif)
Closes #18575
See merge request !4652
Diffstat (limited to 'app/assets')
-rw-r--r-- | app/assets/javascripts/LabelManager.js.coffee | 7 | ||||
-rw-r--r-- | app/assets/stylesheets/framework/lists.scss | 2 | ||||
-rw-r--r-- | app/assets/stylesheets/framework/nav.scss | 6 | ||||
-rw-r--r-- | app/assets/stylesheets/pages/labels.scss | 14 |
4 files changed, 26 insertions, 3 deletions
diff --git a/app/assets/javascripts/LabelManager.js.coffee b/app/assets/javascripts/LabelManager.js.coffee index 365a062bb81..b06bcf0fcbf 100644 --- a/app/assets/javascripts/LabelManager.js.coffee +++ b/app/assets/javascripts/LabelManager.js.coffee @@ -42,10 +42,10 @@ class @LabelManager $from = @prioritizedLabels if $from.find('li').length is 1 - $from.find('.empty-message').show() + $from.find('.empty-message').removeClass('hidden') if not $target.find('li').length - $target.find('.empty-message').hide() + $target.find('.empty-message').addClass('hidden') $label.detach().appendTo($target) @@ -54,6 +54,9 @@ class @LabelManager if action is 'remove' xhr = $.ajax url: url, type: 'DELETE' + + # Restore empty message + $from.find('.empty-message').removeClass('hidden') unless $from.find('li').length else xhr = @savePrioritySort($label, action) diff --git a/app/assets/stylesheets/framework/lists.scss b/app/assets/stylesheets/framework/lists.scss index b34ec16cdba..a12c0bba44a 100644 --- a/app/assets/stylesheets/framework/lists.scss +++ b/app/assets/stylesheets/framework/lists.scss @@ -159,7 +159,7 @@ ul.content-list { background-color: $gray-light; border: dotted 1px $gray-dark; margin: 1px 0; - min-height: 30px; + min-height: 52px; } } } diff --git a/app/assets/stylesheets/framework/nav.scss b/app/assets/stylesheets/framework/nav.scss index 282fffcf986..a8f00e46502 100644 --- a/app/assets/stylesheets/framework/nav.scss +++ b/app/assets/stylesheets/framework/nav.scss @@ -242,6 +242,12 @@ } } } + + &.adjust { + .nav-text, .nav-controls { + width: auto; + } + } } .layout-nav { diff --git a/app/assets/stylesheets/pages/labels.scss b/app/assets/stylesheets/pages/labels.scss index bc65404a741..046c38aba44 100644 --- a/app/assets/stylesheets/pages/labels.scss +++ b/app/assets/stylesheets/pages/labels.scss @@ -115,6 +115,13 @@ } } +.draggable-handler { + display: inline-block; + opacity: 0; + transition: opacity .3s; + color: $gray-darkest; +} + .prioritized-labels { margin-bottom: 30px; @@ -122,6 +129,13 @@ display: none; color: $gray-light; } + + li:hover { + .draggable-handler { + display: inline-block; + opacity: 1; + } + } } .other-labels { |