In sidebar, show × on hover on label to remove the label
Description
For now to deal with a labels in sidebar is a pain, I propose the small fix that allow us to remove labels much faster and be more productive.
Proposal
We add a chip with an x
icon (icn/close
) that can be clicked to delete the label. The chip will change its style and show a background on hover and active states.
The shape of the chip will be a 16px x 16px
circle. The icon inside should be 8px x 8px
. The margin with the label name is 2px
and the padding on the right side of the chip is 4px
. Spec previous will be uploaded with all these measurements.
The target area of the chip will be a 16px x 16px
square indepndently of its shape.
We currently underline the label's name when hovering. This underline should be removed when hovering over the chip.
States | Sidebar |
---|---|
The colors of the badge are based on the label name color:
Resting | Hover | Active | |
---|---|---|---|
Icon | Color: same as text , Opacity: 100%
|
Color: same as text , Opacity: 100%
|
Color: same as label , Opacity: 100%
|
Icon Background | Color: none , Opacity: 0%
|
Color: same as text , Opacity: 30%
|
Color: same as text , Opacity: 100%
|
In scope
- This should apply to issue, merge request, and epic pages.
- This should apply to the slide out board sidebar for project boards and group boards.