vue-easy-dnd
Version:
Easy-DnD is a drag and drop implementation for Vue 3 that uses only standard mouse events instead of the HTML5 drag and drop API, which is [impossible to work with](https://www.quirksmode.org/blog/archives/2009/09/the_html5_drag.html). Think of it as a wa
65 lines (53 loc) • 1.33 kB
CSS
html.drag-in-progress * {
cursor: move ;
cursor: grabbing ;
}
.drop-allowed.drop-in * {
cursor: inherit ;
}
.drop-forbidden.drop-in, .drop-forbidden.drop-in * {
cursor: no-drop ;
}
.drag-no-handle:hover {
cursor: move;
cursor: grab;
}
/* Places a drag image out of sight while keeping its computed styles accessibles. */
.__drag-image[data-v-f87407ce] {
position: fixed;
top: -10000px;
left: -10000px;
will-change: left, top;
}
.drop-allowed.drop-in * {
cursor: inherit ;
}
.drop-forbidden.drop-in, .drop-forbidden.drop-in * {
cursor: no-drop ;
}
.drop-list[data-v-230f65e3] > * {
transition: transform 0.2s;
}
.__feedback[data-v-230f65e3] {
display: none;
}
/* Places a drag image out of sight while keeping its computed styles accessibles. */
.__drag-image[data-v-230f65e3] {
position: fixed;
top: -10000px;
left: -10000px;
will-change: left, top;
}
.drop-allowed.drop-in, .drop-allowed.drop-in * {
cursor: pointer ;
}
.drop-forbidden.drop-in, .drop-forbidden.drop-in * {
cursor: no-drop ;
}
/* Places a drag image out of sight while keeping its computed styles accessibles. */
.__drag-image[data-v-12a39e52] {
position: fixed;
top: -10000px;
left: -10000px;
will-change: left, top;
}