Titlebar cleanup (#3675)

[[PR Description]]

Clean up titlebar design nits

- Remove red borders
- Update menu button styles
- Adjust padding
- Improve tooltips with keybindings

Release Notes:

- N/A
This commit is contained in:
Nate Butler
2023-12-15 11:45:52 -05:00
committed by GitHub
3 changed files with 18 additions and 14 deletions
+12 -10
View File
@@ -74,12 +74,16 @@ impl Render for CollabTitlebarItem {
// Set a non-scaling min-height here to ensure the titlebar is
// always at least the height of the traffic lights.
.min_h(px(32.))
.when(
!matches!(cx.window_bounds(), WindowBounds::Fullscreen),
// Use pixels here instead of a rem-based size because the macOS traffic
// lights are a static size, and don't scale with the rest of the UI.
|s| s.pl(px(68.)),
)
.pl_2()
.map(|this| {
if matches!(cx.window_bounds(), WindowBounds::Fullscreen) {
this.pl_2()
} else {
// Use pixels here instead of a rem-based size because the macOS traffic
// lights are a static size, and don't scale with the rest of the UI.
this.pl(px(72.))
}
})
.bg(cx.theme().colors().title_bar_background)
.on_click(|event, cx| {
if event.up.click_count == 2 {
@@ -165,6 +169,7 @@ impl Render for CollabTitlebarItem {
.child(
h_stack()
.gap_1()
.pr_1()
.when_some(room, |this, room| {
let room = room.read(cx);
let is_shared = self.project.read(cx).is_shared();
@@ -325,8 +330,6 @@ impl CollabTitlebarItem {
let name = util::truncate_and_trailoff(name, MAX_PROJECT_NAME_LENGTH);
div()
.border()
.border_color(gpui::red())
.child(
Button::new("project_name_trigger", name)
.style(ButtonStyle::Subtle)
@@ -365,10 +368,9 @@ impl CollabTitlebarItem {
Some(
div()
.border()
.border_color(gpui::red())
.child(
Button::new("project_branch_trigger", branch_name)
.color(Color::Muted)
.style(ButtonStyle::Subtle)
.tooltip(move |cx| {
Tooltip::with_meta(
+4 -2
View File
@@ -1389,7 +1389,9 @@ impl ProjectPanel {
entry_id: *entry_id,
})
})
.drag_over::<ProjectEntryId>(|style| style.bg(cx.theme().colors().ghost_element_hover))
.drag_over::<ProjectEntryId>(|style| {
style.bg(cx.theme().colors().drop_target_background)
})
.on_drop(cx.listener(move |this, dragged_id: &ProjectEntryId, cx| {
this.move_entry(*dragged_id, entry_id, kind.is_file(), cx);
}))
@@ -1399,7 +1401,7 @@ impl ProjectPanel {
.indent_step_size(px(settings.indent_size))
.selected(is_selected)
.child(if let Some(icon) = &icon {
div().child(IconElement::from_path(icon.to_string()))
div().child(IconElement::from_path(icon.to_string()).color(Color::Muted))
} else {
div()
})
+2 -2
View File
@@ -78,13 +78,13 @@ impl Render for Tooltip {
v_stack()
.elevation_2(cx)
.font(ui_font)
.text_ui_sm()
.text_ui()
.text_color(cx.theme().colors().text)
.py_1()
.px_2()
.child(
h_stack()
.gap_2()
.gap_4()
.child(self.title.clone())
.when_some(self.key_binding.clone(), |this, key_binding| {
this.justify_between().child(key_binding)