tab: Update default tab size padding x to match with Panel's padding. (#701)

- Fix muted_foreground in dark mode.
- Fix secondary button active color in dark mode.
- Fix to ensure render last empty space when TabBar have suffix.

<img width="1203" alt="image"
src="https://github.com/user-attachments/assets/65144893-6705-4087-87f3-7e478eaa1405"
/>
<img width="1203" alt="image"
src="https://github.com/user-attachments/assets/0fe3b72b-11f5-4917-959c-a2c88ba0213c"
/>
This commit is contained in:
Jason Lee 2025-03-10 21:23:00 +08:00 committed by GitHub
parent 54d74a9617
commit 61bb78d174
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
4 changed files with 12 additions and 19 deletions

View file

@ -618,8 +618,7 @@ impl ButtonVariant {
ButtonVariant::Link => cx.theme().transparent,
ButtonVariant::Text => cx.theme().transparent,
ButtonVariant::Custom(colors) => colors.active,
}
.opacity(0.5);
};
let border = self.border_color(cx);
let fg = match self {

View file

@ -90,18 +90,15 @@ impl TabVariant {
}
}
/// Default px(12) to match panel px_3, See [`crate::dock::TabPanel`]
fn inner_paddings(&self, size: Size) -> Edges<Pixels> {
let mut px = match size {
let px = match size {
Size::XSmall => px(8.),
Size::Small => px(12.),
Size::Large => px(20.),
_ => px(16.),
Size::Small => px(10.),
Size::Large => px(16.),
_ => px(12.),
};
if *self == TabVariant::Segmented {
px = px / 2.;
}
Edges {
left: px,
right: px,

View file

@ -234,12 +234,9 @@ impl RenderOnce for TabBar {
})
}),
)
.when(
self.suffix.is_some() && self.variant == TabVariant::Tab
|| self.variant == TabVariant::Underline
|| self.variant == TabVariant::Pill,
|this| this.child(self.last_empty_space),
),
.when(self.suffix.is_some(), |this| {
this.child(self.last_empty_space)
}),
)
.when_some(self.suffix, |this, suffix| this.child(suffix))
}

View file

@ -259,7 +259,7 @@ impl ThemeColor {
scrollbar_thumb: hsl(0., 0., 69.).opacity(0.9),
scrollbar_thumb_hover: hsl(0., 0., 59.),
secondary: hsl(240.0, 5.9, 96.9),
secondary_active: hsl(240.0, 5.9, 90.),
secondary_active: hsl(240.0, 5.9, 93.),
secondary_foreground: hsl(240.0, 59.0, 10.),
secondary_hover: hsl(240.0, 5.9, 98.),
selection: hsl(211.0, 97.0, 85.0),
@ -326,7 +326,7 @@ impl ThemeColor {
list_head: hsl(0.0, 0.0, 8.0),
list_hover: hsl(240.0, 3.7, 15.9),
muted: hsl(240.0, 3.7, 15.9),
muted_foreground: hsl(240.0, 5.0, 64.9),
muted_foreground: hsl(240.0, 5.0, 34.),
popover: hsl(0.0, 0.0, 10.),
popover_foreground: hsl(0.0, 0.0, 78.0),
primary: hsl(223.0, 0.0, 98.0),
@ -339,7 +339,7 @@ impl ThemeColor {
scrollbar_thumb: hsl(0., 0., 48.).opacity(0.9),
scrollbar_thumb_hover: hsl(0., 0., 68.),
secondary: hsl(240.0, 0., 13.0),
secondary_active: hsl(240.0, 0., 10.),
secondary_active: hsl(240.0, 0., 13.),
secondary_foreground: hsl(0.0, 0.0, 78.0),
secondary_hover: hsl(240.0, 0., 15.),
selection: hsl(211.0, 97.0, 22.0),