kibana/x-pack/plugins/lens/public/drag_drop/drag_drop.scss
2020-11-17 10:19:13 +01:00

89 lines
1.7 KiB
SCSS

@import '../variables';
@import '../mixins';
.lnsDragDrop {
transition: background-color $euiAnimSpeedFast ease-in-out, border-color $euiAnimSpeedFast ease-in-out;
}
// Draggable item
.lnsDragDrop-isDraggable {
@include lnsDraggable;
@include lnsDragDropHover;
// Include a possible nested button like when using FieldButton
> .kbnFieldButton__button {
cursor: grab;
}
&:focus {
@include euiFocusRing;
}
}
// Drop area
.lnsDragDrop-isDroppable {
@include lnsDroppable;
}
// Drop area when there's an item being dragged
.lnsDragDrop-isDropTarget {
@include lnsDroppableActive;
}
.lnsDragDrop-isActiveGroup {
background-color: transparentize($euiColorVis0, .75);
}
// Drop area while hovering with item
.lnsDragDrop-isActiveDropTarget {
@include lnsDroppableActiveHover;
}
// Drop area that is not allowed for current item
.lnsDragDrop-isNotDroppable {
@include lnsDroppableNotAllowed;
}
// Drop area will be replacing existing content
.lnsDragDrop-isReplacing {
&,
.lnsLayerPanel__triggerText {
text-decoration: line-through;
}
}
.lnsDragDrop__reorderableContainer {
position: relative;
}
.lnsDragDrop__reorderableDrop {
position: absolute;
width: 100%;
top: 0;
height: calc(100% + #{$lnsLayerPanelDimensionMargin});
}
.lnsDragDrop-isReorderable {
transition: transform $euiAnimSpeedFast ease-in-out;
pointer-events: none;
}
// Draggable item when it is moving
.lnsDragDrop-isHidden {
opacity: 0;
}
.lnsDragDrop__keyboardHandler {
top: 0;
position: absolute;
width: 100%;
height: 100%;
border-radius: $euiBorderRadius;
&:focus,
&:focus-within {
@include euiFocusRing;
pointer-events: none;
}
}