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"
/>

crates/ui/src/button/button.rs

@@ -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 {

crates/ui/src/tab/tab.rs

@@ -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::Small => px(10.),
-            Size::Large => px(20.),
+            Size::Large => px(16.),
-            _ => px(16.),
+            _ => px(12.),
         };
 
-        if *self == TabVariant::Segmented {
-            px = px / 2.;
-        }
-
         Edges {
             left: px,
             right: px,

crates/ui/src/tab/tab_bar.rs

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

crates/ui/src/theme.rs

@@ -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),