scrollbar: Smaller the scrollbar size. (#294)

<img width="918" alt="image"
src="https://github.com/user-attachments/assets/787766ab-63eb-4568-972b-5abd668511f7">

crates/story/src/list_story.rs

@@ -180,18 +180,20 @@ impl ListDelegate for CompanyListDelegate {
                     .border_color(cx.theme().muted_foreground.opacity(0.3))
                     .line_height(relative(1.))
                     .p_1()
-                    .child(div().child(name).text_xs())
+                    .child(div().whitespace_nowrap().child(name).text_xs())
             })
             .collect::<Vec<_>>();
 
-
         let element = v_flex()
             .p_4()
             .child(
-                v_flex()
-                    .gap_y_2()
-                    .child("History")
-                    .child(h_flex().gap_x_4().children(input_history)),
+                v_flex().gap_y_2().child("History").child(
+                    h_flex()
+                        .gap_x_4()
+                        .gap_y_2()
+                        .flex_wrap()
+                        .children(input_history),
+                ),
             )
             .into_any_element();
         Some(element)

crates/ui/src/dock/tab_panel.rs

@@ -16,7 +16,7 @@ use crate::{
     popup_menu::{PopupMenu, PopupMenuExt},
     tab::{Tab, TabBar},
     theme::ActiveTheme,
-    v_flex, AxisExt, IconName, Placement, Selectable, Sizable, StyledExt,
+    v_flex, AxisExt, IconName, Placement, Selectable, Sizable,
 };
 
 use super::{
@@ -473,12 +473,10 @@ impl TabPanel {
                     div()
                         .id("tab")
                         .flex_1()
-                        .debug_red()
                         .min_w_16()
                         .overflow_hidden()
                         .text_ellipsis()
                         .whitespace_nowrap()
-                        .debug_green()
                         .child(panel.title(cx))
                         .when(self.can_split(), |this| {
                             this.on_drag(

crates/ui/src/scroll/scrollbar.rs

@@ -162,7 +162,7 @@ impl Scrollbar {
             state,
             axis,
             scroll_size,
-            width: px(11.),
+            width: px(8.),
             scroll_handle: Rc::new(Box::new(scroll_handle)),
         }
     }

crates/ui/src/theme.rs

@@ -201,7 +201,7 @@ impl Colors {
             input: hsl(240.0, 5.9, 90.0),
             ring: hsl(240.0, 5.9, 65.0),
             selection: hsl(211.0, 97.0, 85.0),
-            scrollbar: hsl(0., 0., 97.).opacity(0.7),
+            scrollbar: hsl(0., 0., 97.).opacity(0.3),
             scrollbar_thumb: hsl(0., 0., 69.),
             panel: hsl(0.0, 0.0, 100.0),
             tab_bar: hsl(240.0, 4.8, 95.9),
@@ -243,8 +243,8 @@ impl Colors {
             input: hsl(240.0, 3.7, 15.9),
             ring: hsl(240.0, 4.9, 83.9),
             selection: hsl(211.0, 97.0, 22.0),
-            scrollbar: hsl(240., 1., 15.).opacity(0.7),
-            scrollbar_thumb: hsl(0., 0., 58.),
+            scrollbar: hsl(240., 1., 15.).opacity(0.3),
+            scrollbar_thumb: hsl(0., 0., 68.),
             panel: hsl(299.0, 2., 9.),
             tab_bar: hsl(299.0, 2., 9.),
             list: hsl(0.0, 0.0, 6.0),