Vaadin lets you build secure, UX-first PWAs entirely in Java.
Free ebook & tutorial.
css styling of dragged items
I have some styling problems with dragged rows in my tables. I've no idea if I have made something wrong or what happens here. Dragging and dropping works fine, but unfortunately the styling of the dragged items is bizarre in some cases.
It's difficult to explain the strange appearance but I think a generall problem is, that the styling of the dragged items isn't taken from the table. It's a more global style. So when the rows in the table are set to 12 px height, the height of the dragged rows has standard height again, but only when I drag selected rows. When I drag unselected rows the size is as it is in the table, but the padding isn't taken. So in this second case the text is too far below.
I found that there are two elements in css:
".v-drag-element" defines unselected dragged rows and "tbody.v-drag-element" defines selected rows. I can change there content but this will change every dragged item in my application...
So is there either any way the dragged items really look as the original (with an opacity)? Or can one define the style for dragged rows per table?
Anyone having similar issues? I'm wondering that I don't find anything usefull in the forum or when I try to google it...
I don't think it's possible to define the style per Table basis as the v-drag-element doesn't have any instance specific style name in it.
Unfortunately I can't help you regarding your primary question about how to make the dragged item to look the same as the original.
ok, I was already afraid that this isn't possible.
I'm pretty sure that it is possible to make them look like the original, because as I said the row height is taken from it. But the content isn't... I have no idea why and how to change that...
But thanks for reply!