From 46834d31f139b7d9d1fdf1a1e072437f7f128e29 Mon Sep 17 00:00:00 2001 From: Danilo Leal <67129314+danilo-leal@users.noreply.github.com> Date: Sat, 12 Jul 2025 11:48:19 -0300 Subject: [PATCH] Refine status bar design (#34324) Experimenting with a set of standardized icons and polishing spacing a little bit. Release Notes: - N/A --- assets/icons/debug.svg | 13 ++++++++++++- assets/icons/file_tree.svg | 6 +++--- assets/icons/git_branch_small.svg | 11 ++++++----- assets/icons/list_tree.svg | 8 +++++++- assets/icons/terminal_alt.svg | 5 +++++ assets/icons/user_group.svg | 4 +++- assets/icons/zed_assistant.svg | 2 +- crates/icons/src/icons.rs | 1 + crates/search/src/search_status_button.rs | 18 ++++++------------ crates/terminal_view/src/terminal_panel.rs | 2 +- .../ui/src/components/progress/progress_bar.rs | 3 +-- crates/workspace/src/dock.rs | 9 +++++---- crates/workspace/src/status_bar.rs | 15 ++++++++------- 13 files changed, 59 insertions(+), 38 deletions(-) create mode 100644 assets/icons/terminal_alt.svg diff --git a/assets/icons/debug.svg b/assets/icons/debug.svg index 8cea0c4604..ff51e42b1a 100644 --- a/assets/icons/debug.svg +++ b/assets/icons/debug.svg @@ -1 +1,12 @@ - + + + + + + + + + + + + diff --git a/assets/icons/file_tree.svg b/assets/icons/file_tree.svg index 4c921b1351..a140cd70b1 100644 --- a/assets/icons/file_tree.svg +++ b/assets/icons/file_tree.svg @@ -1,5 +1,5 @@ - - - + + + diff --git a/assets/icons/git_branch_small.svg b/assets/icons/git_branch_small.svg index d23fc176ac..22832d6fed 100644 --- a/assets/icons/git_branch_small.svg +++ b/assets/icons/git_branch_small.svg @@ -1,6 +1,7 @@ - - - - - + + + + + + diff --git a/assets/icons/list_tree.svg b/assets/icons/list_tree.svg index 8cf157ec13..09872a60f7 100644 --- a/assets/icons/list_tree.svg +++ b/assets/icons/list_tree.svg @@ -1 +1,7 @@ - \ No newline at end of file + + + + + + + diff --git a/assets/icons/terminal_alt.svg b/assets/icons/terminal_alt.svg new file mode 100644 index 0000000000..7afb89db21 --- /dev/null +++ b/assets/icons/terminal_alt.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/assets/icons/user_group.svg b/assets/icons/user_group.svg index aa99277646..ac1f7bdc63 100644 --- a/assets/icons/user_group.svg +++ b/assets/icons/user_group.svg @@ -1,3 +1,5 @@ - + + + diff --git a/assets/icons/zed_assistant.svg b/assets/icons/zed_assistant.svg index 693d86f929..d21252de8c 100644 --- a/assets/icons/zed_assistant.svg +++ b/assets/icons/zed_assistant.svg @@ -1,5 +1,5 @@ - + diff --git a/crates/icons/src/icons.rs b/crates/icons/src/icons.rs index 76a04e036d..4151e6b2ea 100644 --- a/crates/icons/src/icons.rs +++ b/crates/icons/src/icons.rs @@ -247,6 +247,7 @@ pub enum IconName { SwatchBook, Tab, Terminal, + TerminalAlt, TextSnippet, ThumbsDown, ThumbsUp, diff --git a/crates/search/src/search_status_button.rs b/crates/search/src/search_status_button.rs index fcdf36041f..ff2ee1641d 100644 --- a/crates/search/src/search_status_button.rs +++ b/crates/search/src/search_status_button.rs @@ -1,9 +1,6 @@ use editor::EditorSettings; use settings::Settings as _; -use ui::{ - ButtonCommon, ButtonLike, Clickable, Color, Context, Icon, IconName, IconSize, ParentElement, - Render, Styled, Tooltip, Window, h_flex, -}; +use ui::{ButtonCommon, Clickable, Context, Render, Tooltip, Window, prelude::*}; use workspace::{ItemHandle, StatusItemView}; pub struct SearchButton; @@ -16,18 +13,15 @@ impl SearchButton { impl Render for SearchButton { fn render(&mut self, _window: &mut Window, cx: &mut Context) -> impl ui::IntoElement { - let button = h_flex().gap_2(); + let button = div(); + if !EditorSettings::get_global(cx).search.button { - return button; + return button.w_0().invisible(); } button.child( - ButtonLike::new("project-search-indicator") - .child( - Icon::new(IconName::MagnifyingGlass) - .size(IconSize::Small) - .color(Color::Default), - ) + IconButton::new("project-search-indicator", IconName::MagnifyingGlass) + .icon_size(IconSize::Small) .tooltip(|window, cx| { Tooltip::for_action( "Project Search", diff --git a/crates/terminal_view/src/terminal_panel.rs b/crates/terminal_view/src/terminal_panel.rs index f6eee3065c..cb1e362884 100644 --- a/crates/terminal_view/src/terminal_panel.rs +++ b/crates/terminal_view/src/terminal_panel.rs @@ -1437,7 +1437,7 @@ impl Panel for TerminalPanel { if (self.is_enabled(cx) || !self.has_no_terminals(cx)) && TerminalSettings::get_global(cx).button { - Some(IconName::Terminal) + Some(IconName::TerminalAlt) } else { None } diff --git a/crates/ui/src/components/progress/progress_bar.rs b/crates/ui/src/components/progress/progress_bar.rs index 67b6be6723..5cc5abd36d 100644 --- a/crates/ui/src/components/progress/progress_bar.rs +++ b/crates/ui/src/components/progress/progress_bar.rs @@ -69,8 +69,7 @@ impl RenderOnce for ProgressBar { .w_full() .h(px(8.0)) .rounded_full() - .py(px(2.0)) - .px(px(4.0)) + .p(px(2.0)) .bg(self.bg_color) .shadow(vec![gpui::BoxShadow { color: gpui::black().opacity(0.08), diff --git a/crates/workspace/src/dock.rs b/crates/workspace/src/dock.rs index 8fcd55b784..c8301dcf35 100644 --- a/crates/workspace/src/dock.rs +++ b/crates/workspace/src/dock.rs @@ -221,9 +221,9 @@ pub enum DockPosition { impl DockPosition { fn label(&self) -> &'static str { match self { - Self::Left => "left", - Self::Bottom => "bottom", - Self::Right => "right", + Self::Left => "Left", + Self::Bottom => "Bottom", + Self::Right => "Right", } } @@ -864,7 +864,7 @@ impl Render for PanelButtons { let action = dock.toggle_action(); let tooltip: SharedString = - format!("Close {} dock", dock.position.label()).into(); + format!("Close {} Dock", dock.position.label()).into(); (action, tooltip) } else { @@ -923,6 +923,7 @@ impl Render for PanelButtons { .collect(); let has_buttons = !buttons.is_empty(); + h_flex() .gap_1() .children(buttons) diff --git a/crates/workspace/src/status_bar.rs b/crates/workspace/src/status_bar.rs index 798d49eec5..edeb382de7 100644 --- a/crates/workspace/src/status_bar.rs +++ b/crates/workspace/src/status_bar.rs @@ -42,7 +42,7 @@ impl Render for StatusBar { .justify_between() .gap(DynamicSpacing::Base08.rems(cx)) .py(DynamicSpacing::Base04.rems(cx)) - .px(DynamicSpacing::Base08.rems(cx)) + .px(DynamicSpacing::Base06.rems(cx)) .bg(cx.theme().colors().status_bar_background) .map(|el| match window.window_decorations() { Decorations::Server => el, @@ -58,22 +58,23 @@ impl Render for StatusBar { .border_b(px(1.0)) .border_color(cx.theme().colors().status_bar_background), }) - .child(self.render_left_tools(cx)) - .child(self.render_right_tools(cx)) + .child(self.render_left_tools()) + .child(self.render_right_tools()) } } impl StatusBar { - fn render_left_tools(&self, cx: &mut Context) -> impl IntoElement { + fn render_left_tools(&self) -> impl IntoElement { h_flex() - .gap(DynamicSpacing::Base04.rems(cx)) + .gap_1() .overflow_x_hidden() .children(self.left_items.iter().map(|item| item.to_any())) } - fn render_right_tools(&self, cx: &mut Context) -> impl IntoElement { + fn render_right_tools(&self) -> impl IntoElement { h_flex() - .gap(DynamicSpacing::Base04.rems(cx)) + .gap_1() + .overflow_x_hidden() .children(self.right_items.iter().rev().map(|item| item.to_any())) } }