diff --git a/front/src/components/Queue.vue b/front/src/components/Queue.vue index 6aafd088c..84ad381fe 100644 --- a/front/src/components/Queue.vue +++ b/front/src/components/Queue.vue @@ -85,9 +85,10 @@ const scrollToCurrent = (behavior: ScrollBehavior = 'smooth') => { watchDebounced(currentTrack, () => scrollToCurrent(), { debounce: 100 }) whenever( () => store.state.ui.queueFocused, - () => { + async () => { list.value?.scrollToIndex(currentIndex.value) - setTimeout(() => scrollToCurrent('auto'), 1) + await nextTick() + requestAnimationFrame(() => scrollToCurrent('auto')) } ) diff --git a/front/src/components/vui/list/VirtualList.vue b/front/src/components/vui/list/VirtualList.vue index 7836a3d01..fd1571a24 100644 --- a/front/src/components/vui/list/VirtualList.vue +++ b/front/src/components/vui/list/VirtualList.vue @@ -156,6 +156,7 @@ const { resume, pause } = useRafFn(() => { }, { immediate: false }) const virtualList = ref() +window.vl = virtualList defineExpose({ scrollToIndex: (index: number) => virtualList.value?.scrollToItem(index), cleanup diff --git a/front/src/style/components/_queue.scss b/front/src/style/components/_queue.scss index 798bbbce3..62ec2db2a 100644 --- a/front/src/style/components/_queue.scss +++ b/front/src/style/components/_queue.scss @@ -344,7 +344,7 @@ } } -.drag-container:not(.dragging) .queue-item:hover { +.drag-container:not(.dragging) .hover .queue-item { background: rgba(0,0,0,.05); color: #000000f2; } \ No newline at end of file