Styling .sortable-drag element in Vue.Draggable and Sortablejs

1.8k Views Asked by At

I'm trying to style the drag elements according to some validation states.

Here is the jsfiddle I created as an example. In this example the sortable-ghost class is being styled with a yellow background and a red border but if the element is being dropped on "Do not drop here" element then it will get the red background and become more transparent.

This part is working fine.

enter image description here

What I would like to style additionally is the sortable-drag class. I'd like to give it a blue background when the sortable-ghost gets the red background but I cant figure out how to do it.

It looks to me like the sortable-drag is exact clone of the element at the moment you start to drag it. To test this claim you can drop something on the "Do not drop here" element which will cause the warnMove to hold its value setting the warn class on the draggable wrapper and if you try to drag any element after that you will see it in blue even though the warnMove is reset and this should not be styled with blue background.

enter image description here

http://jsfiddle.net/dct1s6nv/9/

0

There are 0 best solutions below