oak-team/oak-gpui
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

workspace: Highlight where dragged tab will be dropped (#34740)

Browse Source 
Closes #18565

I could use some advice on the color palette / theming. A couple
options:

1. The `drop_target_background` color could be used for the border if we
didn't use it for the background of the tab. In VSCode, the background
color of tabs doesn't change as you're dragging, there's just a border
between tabs. My only concern with this option is that the current
`drop_target_background` color is a bit subtle when used for a small
area like a border.

2. Another option could be to add a `drop_target_border` theme color,
but I don't know how much complexity this adds to implementation
(presumably all existing themes would need to be updated?).

Demo:


https://github.com/user-attachments/assets/0b7c04ea-5ec5-4b45-adad-156dfbf552db

Release Notes:

- Highlight where a dragged tab will be dropped between two other tabs

---------

Co-authored-by: Smit Barmase <heysmitbarmase@gmail.com>
This commit is contained in:
Daniel Sauble
2025-08-15 11:43:29 +00:00
committed by GitHub
co-authored by Smit Barmase
parent 6f3cd42411
commit 708c434bd4
5 changed files with 28 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
crates/workspace/src/pane.rs
+13 -2
View File
@@ -2478,8 +2478,19 @@ impl Pane {
},
|tab, _, _, cx| cx.new(|_| tab.clone()),
)
.drag_over::<DraggedTab>(|tab, _, _, cx| {
tab.bg(cx.theme().colors().drop_target_background)
.drag_over::<DraggedTab>(move |tab, dragged_tab: &DraggedTab, _, cx| {
let mut styled_tab = tab
.bg(cx.theme().colors().drop_target_background)
.border_color(cx.theme().colors().drop_target_border)
.border_0();
if ix < dragged_tab.ix {
styled_tab = styled_tab.border_l_2();
} else if ix > dragged_tab.ix {
styled_tab = styled_tab.border_r_2();
}
styled_tab
})
.drag_over::<DraggedSelection>(|tab, _, _, cx| {
tab.bg(cx.theme().colors().drop_target_background)