mixa/zed
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

settings ui: Add a handful of design tweaks (#39784)

Browse Source 
Release Notes:

- N/A
This commit is contained in:
Danilo Leal
2025-10-08 12:27:22 -03:00
committed by GitHub
parent 5fa4b3bfe8
commit 70af11ef2a
2 changed files with 66 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

101
crates/ui/src/components/tree_view_item.rs
View File

@@ -127,6 +127,7 @@ impl RenderOnce for TreeViewItem {
fn render(self, _window: &mut Window, cx: &mut App) -> impl IntoElement {
let selected_bg = cx.theme().colors().element_active.opacity(0.5);
let transparent_border = cx.theme().colors().border.opacity(0.);
let selected_border = cx.theme().colors().border.opacity(0.6);
let focused_border = cx.theme().colors().border_focused;
@@ -145,17 +146,8 @@ impl RenderOnce for TreeViewItem {
.child(
h_flex()
.id("inner_tree_view_item")
.group("tree_view_item")
.cursor_pointer()
.size_full()
.relative()
.border_1()
.focus(|s| s.border_color(focused_border))
.when_some(self.tab_index, |this, index| this.tab_index(index))
.when(self.selected, |this| {
this.border_color(selected_border).bg(selected_bg)
})
.hover(|s| s.bg(cx.theme().colors().element_hover))
.map(|this| {
let label = self.label;
@@ -164,6 +156,14 @@ impl RenderOnce for TreeViewItem {
.px_1()
.gap_2p5()
.rounded_sm()
.border_1()
.border_color(transparent_border)
.when(self.selected, |this| {
this.border_color(selected_border).bg(selected_bg)
})
.focus(|s| s.border_color(focused_border))
.hover(|s| s.bg(cx.theme().colors().element_hover))
.when_some(self.tab_index, |this, index| this.tab_index(index))
.child(
Disclosure::new("toggle", self.expanded)
.when_some(
@@ -179,6 +179,33 @@ impl RenderOnce for TreeViewItem {
Label::new(label)
.when(!self.selected, |this| this.color(Color::Muted)),
)
.when_some(self.on_hover, |this, on_hover| this.on_hover(on_hover))
.when_some(
self.on_click.filter(|_| !self.disabled),
|this, on_click| {
if self.root_item
&& let Some(on_toggle) = self.on_toggle.clone()
{
this.on_click(move |event, window, cx| {
if event.is_keyboard() {
on_click(event, window, cx);
on_toggle(event, window, cx);
} else {
on_click(event, window, cx);
}
})
} else {
this.on_click(on_click)
}
},
)
.when_some(self.on_secondary_mouse_down, |this, on_mouse_down| {
this.on_mouse_down(
MouseButton::Right,
move |event, window, cx| (on_mouse_down)(event, window, cx),
)
})
.when_some(self.tooltip, |this, tooltip| this.tooltip(tooltip))
} else {
this.child(indentation_line).child(
h_flex()
@@ -187,40 +214,40 @@ impl RenderOnce for TreeViewItem {
.flex_grow()
.px_1()
.rounded_sm()
.border_1()
.border_color(transparent_border)
.when(self.selected, |this| {
this.border_color(selected_border).bg(selected_bg)
})
.focus(|s| s.border_color(focused_border))
.hover(|s| s.bg(cx.theme().colors().element_hover))
.when_some(self.tab_index, |this, index| this.tab_index(index))
.child(
Label::new(label)
.when(!self.selected, |this| this.color(Color::Muted)),
),
)
.when_some(self.on_hover, |this, on_hover| {
this.on_hover(on_hover)
})
.when_some(
self.on_click.filter(|_| !self.disabled),
|this, on_click| this.on_click(on_click),
)
.when_some(
self.on_secondary_mouse_down,
|this, on_mouse_down| {
this.on_mouse_down(
MouseButton::Right,
move |event, window, cx| {
(on_mouse_down)(event, window, cx)
},
)
},
)
.when_some(self.tooltip, |this, tooltip| this.tooltip(tooltip)),
)
}
})
.when_some(self.on_hover, |this, on_hover| this.on_hover(on_hover))
.when_some(
self.on_click.filter(|_| !self.disabled),
|this, on_click| {
if self.root_item
&& let Some(on_toggle) = self.on_toggle.clone()
{
this.on_click(move |event, window, cx| {
if event.is_keyboard() {
on_click(event, window, cx);
on_toggle(event, window, cx);
} else {
on_click(event, window, cx);
}
})
} else {
this.on_click(on_click)
}
},
)
.when_some(self.on_secondary_mouse_down, |this, on_mouse_down| {
this.on_mouse_down(MouseButton::Right, move |event, window, cx| {
(on_mouse_down)(event, window, cx)
})
})
.when_some(self.tooltip, |this, tooltip| this.tooltip(tooltip)),
}),
)
}
}

4
crates/ui_input/src/number_field.rs
View File

@@ -6,7 +6,7 @@ use std::{
};
use editor::{Editor, EditorStyle};
use gpui::{ClickEvent, CursorStyle, Entity, FocusHandle, Focusable, FontWeight, Modifiers};
use gpui::{ClickEvent, Entity, FocusHandle, Focusable, FontWeight, Modifiers};
use settings::{CodeFade, MinimumContrast};
use ui::prelude::*;
@@ -352,7 +352,7 @@ impl<T: NumberFieldType> RenderOnce for NumberField<T> {
let base_button = |icon: IconName| {
h_flex()
.cursor(CursorStyle::PointingHand)
.cursor_pointer()
.p_1p5()
.size_full()
.justify_center()