reya/coop
1
0
Fork 0
Code Issues Pull Requests Releases Activity

refine tabbar
Some checks failed
Rust / build (ubuntu-latest, stable) (push) Failing after 1m11s
Rust / build (ubuntu-latest, stable) (pull_request) Failing after 1m5s

Browse Source
This commit is contained in:
reya
2026-01-24 06:16:02 +07:00
parent 6617c8eea3
commit 2f81753fff
4 changed files with 54 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
crates/dock/src/tab/mod.rs
View File

@@ -1,9 +1,9 @@
use gpui::prelude::FluentBuilder; use gpui::prelude::FluentBuilder;
use gpui::{ use gpui::{
div, px, AnyElement, App, Div, InteractiveElement, IntoElement, ParentElement, RenderOnce, div, px, AnyElement, App, Div, InteractiveElement, IntoElement, MouseButton, ParentElement,
StatefulInteractiveElement, Styled, Window, RenderOnce, StatefulInteractiveElement, Styled, Window,
}; };
use theme::ActiveTheme; use theme::{ActiveTheme, TITLEBAR_HEIGHT};
use ui::{Selectable, Sizable, Size}; use ui::{Selectable, Sizable, Size};
pub mod tab_bar; pub mod tab_bar;
@@ -130,7 +130,7 @@ impl RenderOnce for Tab {
self.base self.base
.id(self.ix) .id(self.ix)
.h(px(30.)) .h(TITLEBAR_HEIGHT)
.px_2() .px_2()
.relative() .relative()
.flex() .flex()
@@ -142,11 +142,24 @@ impl RenderOnce for Tab {
.text_ellipsis() .text_ellipsis()
.text_color(text_color) .text_color(text_color)
.bg(bg_color) .bg(bg_color)
.hover(|this| this.bg(hover_bg_color)) .border_l(px(1.))
.border_r(px(1.))
.border_color(cx.theme().border)
.when(!self.selected, |this| {
this.hover(|this| {
this.text_color(text_color)
.bg(hover_bg_color)
.border_l(px(0.))
.border_r(px(0.))
})
})
.when_some(self.prefix, |this, prefix| { .when_some(self.prefix, |this, prefix| {
this.child(prefix).text_color(text_color) this.child(prefix).text_color(text_color)
}) })
.when_some(self.label, |this, label| this.child(label)) .when_some(self.label, |this, label| this.child(label))
.when_some(self.suffix, |this, suffix| this.child(suffix)) .when_some(self.suffix, |this, suffix| this.child(suffix))
.on_mouse_down(MouseButton::Left, |_ev, _window, cx| {
cx.stop_propagation();
})
} }
} }

22
crates/dock/src/tab/tab_bar.rs
View File

@@ -27,7 +27,7 @@ pub struct TabBar {
impl TabBar { impl TabBar {
pub fn new() -> Self { pub fn new() -> Self {
Self { Self {
base: div().px(px(-1.)), base: h_flex().px(px(-1.)),
style: StyleRefinement::default(), style: StyleRefinement::default(),
scroll_handle: None, scroll_handle: None,
children: SmallVec::new(), children: SmallVec::new(),
@@ -99,17 +99,23 @@ impl RenderOnce for TabBar {
self.base self.base
.group("tab-bar") .group("tab-bar")
.refine_style(&self.style)
.relative() .relative()
.flex() .refine_style(&self.style)
.items_center()
.bg(cx.theme().elevated_surface_background) .bg(cx.theme().elevated_surface_background)
.when(!focused, |this| { .when(!focused, |this| {
this.bg(cx.theme().elevated_surface_background.opacity(0.75)) // TODO: add specific styles for unfocused tab bar
this.bg(cx.theme().elevated_surface_background)
}) })
.border_b_1() .child(
.border_color(cx.theme().border) div()
.overflow_hidden() .id("border-bottom")
.absolute()
.left_0()
.bottom_0()
.size_full()
.border_b_1()
.border_color(cx.theme().border),
)
.text_color(cx.theme().text) .text_color(cx.theme().text)
.when_some(self.prefix, |this, prefix| this.child(prefix)) .when_some(self.prefix, |this, prefix| this.child(prefix))
.child( .child(

28
crates/dock/src/tab_panel.rs
View File

@@ -664,6 +664,7 @@ impl TabPanel {
.top_0() .top_0()
.right(-px(1.)) .right(-px(1.))
.border_r_1() .border_r_1()
.border_b_1()
.h_full() .h_full()
.border_color(cx.theme().border) .border_color(cx.theme().border)
.bg(cx.theme().elevated_surface_background) .bg(cx.theme().elevated_surface_background)
@@ -791,16 +792,23 @@ impl TabPanel {
)) ))
}), }),
) )
.suffix( .when(!self.collapsed, |this| {
h_flex() this.suffix(
.items_center() h_flex()
.top_0() .items_center()
.right_0() .px_2()
.h_full() .gap_1()
.px_2() .top_0()
.gap_1() .right_0()
.child(self.render_toolbar(state, window, cx)), .h_full()
) .border_color(cx.theme().border)
.border_l_1()
.border_b_1()
.when(!cx.theme().platform.is_mac(), |this| this.border_r_1())
.child(self.render_toolbar(state, window, cx))
.when_some(right_dock_button, |this, btn| this.child(btn)),
)
})
.into_any_element() .into_any_element()
} }

8
crates/theme/src/colors.rs
View File

@@ -106,7 +106,7 @@ impl ThemeColors {
background: neutral().light().step_1(), background: neutral().light().step_1(),
surface_background: neutral().light().step_2(), surface_background: neutral().light().step_2(),
elevated_surface_background: neutral().light().step_3(), elevated_surface_background: neutral().light().step_3(),
panel_background: neutral().light().step_4(), panel_background: neutral().light().step_1(),
overlay: neutral().light_alpha().step_3(), overlay: neutral().light_alpha().step_3(),
title_bar: gpui::transparent_black(), title_bar: gpui::transparent_black(),
title_bar_inactive: neutral().light().step_1(), title_bar_inactive: neutral().light().step_1(),
@@ -166,7 +166,7 @@ impl ThemeColors {
tab_inactive_background: neutral().light().step_2(), tab_inactive_background: neutral().light().step_2(),
tab_hover_background: neutral().light().step_3(), tab_hover_background: neutral().light().step_3(),
tab_active_background: neutral().light().step_4(), tab_active_background: neutral().light().step_1(),
scrollbar_thumb_background: neutral().light_alpha().step_3(), scrollbar_thumb_background: neutral().light_alpha().step_3(),
scrollbar_thumb_hover_background: neutral().light_alpha().step_4(), scrollbar_thumb_hover_background: neutral().light_alpha().step_4(),
@@ -188,7 +188,7 @@ impl ThemeColors {
background: neutral().dark().step_1(), background: neutral().dark().step_1(),
surface_background: neutral().dark().step_2(), surface_background: neutral().dark().step_2(),
elevated_surface_background: neutral().dark().step_3(), elevated_surface_background: neutral().dark().step_3(),
panel_background: neutral().dark().step_4(), panel_background: neutral().dark().step_1(),
overlay: neutral().dark_alpha().step_3(), overlay: neutral().dark_alpha().step_3(),
title_bar: gpui::transparent_black(), title_bar: gpui::transparent_black(),
title_bar_inactive: neutral().dark().step_1(), title_bar_inactive: neutral().dark().step_1(),
@@ -248,7 +248,7 @@ impl ThemeColors {
tab_inactive_background: neutral().dark().step_2(), tab_inactive_background: neutral().dark().step_2(),
tab_hover_background: neutral().dark().step_3(), tab_hover_background: neutral().dark().step_3(),
tab_active_background: neutral().dark().step_4(), tab_active_background: neutral().dark().step_1(),
scrollbar_thumb_background: neutral().dark_alpha().step_3(), scrollbar_thumb_background: neutral().dark_alpha().step_3(),
scrollbar_thumb_hover_background: neutral().dark_alpha().step_4(), scrollbar_thumb_hover_background: neutral().dark_alpha().step_4(),