blevinelrp
commented
3 months ago You can modify the style by adding the following in assets/main.css (example changing the box-shadow to the color white).
.p-datatable .p-datatable-tbody > tr.p-datatable-dragpoint-top > td { box-shadow: inset 0 2px 0 0 #ffffff; } .p-datatable .p-datatable-tbody > tr.p-datatable-dragpoint-bottom > td { box-shadow: inset 0 -2px 0 0 #ffffff; }
The blink is being caused by the rapid adding/removing of the datatable-dragpoint-x class when it meets certain positioning criteria (onDragOver/onDragLeave). Would probably need to debounce those events (issue isn't with the css in those classes). Also, seems a lot worse in Chrome than other browsers.
Describe the bug
Hello i'm trying to change the default Primevue style for the drag events when i drag the row in between rows (like in the video) a blink effect appears. screen-capture (4).webm
Reproducer
https://stackblitz.com/edit/primevue-create-vue-typescript-issue-template-vr3vsk?file=src%2FApp.vue
PrimeVue version
3.47.2
Vue version
3.x
Language
ALL
Build / Runtime
Vite
Browser(s)
Chrome
Steps to reproduce the behavior
1 - Drag a row 2 - Drag and hold the selected row in between 2 row Blink effect appears
Expected behavior
I would like to not have that blink effect so i can add an after css selector an change the style. Or maybe having acces to the events onDragOn and onDragOff.