tabs: Remove underline variant TabBar paddings. (#1126)

<img width="1167" height="1044" alt="image"
src="https://github.com/user-attachments/assets/0a2b34b7-5629-402b-a54a-f975aab77e78"
/>
This commit is contained in:
Jason Lee 2025-08-08 19:06:26 +08:00 committed by GitHub
parent 85e2a72d03
commit b1f4a4f642
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 10 additions and 12 deletions

View file

@ -100,7 +100,7 @@ impl TabVariant {
}; };
if matches!(self, TabVariant::Underline) { if matches!(self, TabVariant::Underline) {
padding_x = padding_x / 2.; padding_x = px(0.);
} }
Edges { Edges {

View file

@ -21,6 +21,7 @@ pub struct SelectTab(usize);
#[derive(IntoElement)] #[derive(IntoElement)]
pub struct TabBar { pub struct TabBar {
base: Stateful<Div>, base: Stateful<Div>,
style: StyleRefinement,
scroll_handle: Option<ScrollHandle>, scroll_handle: Option<ScrollHandle>,
prefix: Option<AnyElement>, prefix: Option<AnyElement>,
suffix: Option<AnyElement>, suffix: Option<AnyElement>,
@ -40,6 +41,7 @@ impl TabBar {
pub fn new(id: impl Into<ElementId>) -> Self { pub fn new(id: impl Into<ElementId>) -> Self {
Self { Self {
base: div().id(id).px(px(-1.)), base: div().id(id).px(px(-1.)),
style: StyleRefinement::default(),
children: SmallVec::new(), children: SmallVec::new(),
scroll_handle: None, scroll_handle: None,
prefix: None, prefix: None,
@ -149,7 +151,7 @@ impl TabBar {
impl Styled for TabBar { impl Styled for TabBar {
fn style(&mut self) -> &mut StyleRefinement { fn style(&mut self) -> &mut StyleRefinement {
self.base.style() &mut self.style
} }
} }
@ -198,18 +200,13 @@ impl RenderOnce for TabBar {
TabVariant::Underline => { TabVariant::Underline => {
// This gap is same as the tab inner_paddings // This gap is same as the tab inner_paddings
let gap = match self.size { let gap = match self.size {
Size::XSmall => px(8.), Size::XSmall => px(10.),
Size::Small => px(10.), Size::Small => px(12.),
Size::Large => px(16.), Size::Large => px(20.),
_ => px(12.), _ => px(16.),
}; };
let padding = Edges { (cx.theme().transparent, Edges::all(px(0.)), gap)
left: gap,
right: gap,
..Default::default()
};
(cx.theme().transparent, padding, gap)
} }
}; };
@ -251,6 +248,7 @@ impl RenderOnce for TabBar {
|this| this.rounded(cx.theme().radius), |this| this.rounded(cx.theme().radius),
) )
.paddings(paddings) .paddings(paddings)
.refine_style(&self.style)
.when_some(self.prefix, |this, prefix| this.child(prefix)) .when_some(self.prefix, |this, prefix| this.child(prefix))
.child( .child(
h_flex() h_flex()