diff --git a/crates/find/src/find.rs b/crates/find/src/find.rs index 47f38ab3f9..ea2b29a277 100644 --- a/crates/find/src/find.rs +++ b/crates/find/src/find.rs @@ -6,8 +6,8 @@ use editor::{ MultiBufferSnapshot, }; use gpui::{ - action, elements::*, keymap::Binding, Entity, MutableAppContext, RenderContext, Subscription, - Task, View, ViewContext, ViewHandle, WeakViewHandle, + action, elements::*, keymap::Binding, platform::CursorStyle, Entity, MutableAppContext, + RenderContext, Subscription, Task, View, ViewContext, ViewHandle, WeakViewHandle, }; use postage::watch; use regex::RegexBuilder; @@ -85,34 +85,30 @@ impl View for FindBar { } fn render(&mut self, cx: &mut RenderContext) -> ElementBox { - let theme = &self.settings.borrow().theme.find; + let theme = &self.settings.borrow().theme; let editor_container = if self.query_contains_error { - theme.invalid_editor + theme.find.invalid_editor } else { - theme.editor.input.container + theme.find.editor.input.container }; Flex::row() .with_child( ChildView::new(&self.query_editor) .contained() .with_style(editor_container) + .aligned() .constrained() - .with_max_width(theme.editor.max_width) + .with_max_width(theme.find.editor.max_width) .boxed(), ) .with_child( Flex::row() - .with_child(self.render_mode_button("Aa", SearchMode::CaseSensitive, theme, cx)) - .with_child(self.render_mode_button("|ab|", SearchMode::WholeWord, theme, cx)) - .with_child(self.render_mode_button(".*", SearchMode::Regex, theme, cx)) + .with_child(self.render_mode_button("Case", SearchMode::CaseSensitive, cx)) + .with_child(self.render_mode_button("Word", SearchMode::WholeWord, cx)) + .with_child(self.render_mode_button("Regex", SearchMode::Regex, cx)) .contained() - .with_style(theme.mode_button_group) - .boxed(), - ) - .with_child( - Flex::row() - .with_child(self.render_nav_button("<", Direction::Prev, theme, cx)) - .with_child(self.render_nav_button(">", Direction::Next, theme, cx)) + .with_style(theme.find.mode_button_group) + .aligned() .boxed(), ) .with_children(self.active_editor.as_ref().and_then(|editor| { @@ -122,18 +118,28 @@ impl View for FindBar { let message = if highlighted_ranges.is_empty() { "No matches".to_string() } else { - format!("{} of {}", match_ix, highlighted_ranges.len()) + format!("{}/{}", match_ix, highlighted_ranges.len()) }; Some( - Label::new(message, theme.match_index.text.clone()) + Label::new(message, theme.find.match_index.text.clone()) .contained() - .with_style(theme.match_index.container) + .with_style(theme.find.match_index.container) + .aligned() .boxed(), ) })) + .with_child( + Flex::row() + .with_child(self.render_nav_button("<", Direction::Prev, cx)) + .with_child(self.render_nav_button(">", Direction::Next, cx)) + .aligned() + .boxed(), + ) .contained() - .with_style(theme.container) - .boxed() + .with_style(theme.find.container) + .constrained() + .with_height(theme.workspace.toolbar.height) + .named("find bar") } } @@ -217,9 +223,9 @@ impl FindBar { &self, icon: &str, mode: SearchMode, - theme: &theme::Find, cx: &mut RenderContext, ) -> ElementBox { + let theme = &self.settings.borrow().theme.find; let is_active = self.is_mode_enabled(mode); MouseEventHandler::new::((cx.view_id(), mode as usize), cx, |state, _| { let style = match (is_active, state.hovered) { @@ -234,6 +240,7 @@ impl FindBar { .boxed() }) .on_click(move |cx| cx.dispatch_action(ToggleMode(mode))) + .with_cursor_style(CursorStyle::PointingHand) .boxed() } @@ -241,9 +248,9 @@ impl FindBar { &self, icon: &str, direction: Direction, - theme: &theme::Find, cx: &mut RenderContext, ) -> ElementBox { + let theme = &self.settings.borrow().theme.find; MouseEventHandler::new::( (cx.view_id(), 10 + direction as usize), cx, @@ -260,6 +267,7 @@ impl FindBar { }, ) .on_click(move |cx| cx.dispatch_action(GoToMatch(direction))) + .with_cursor_style(CursorStyle::PointingHand) .boxed() } diff --git a/crates/theme/src/theme.rs b/crates/theme/src/theme.rs index 37414eca2f..fec42853dc 100644 --- a/crates/theme/src/theme.rs +++ b/crates/theme/src/theme.rs @@ -38,6 +38,7 @@ pub struct Workspace { pub left_sidebar: Sidebar, pub right_sidebar: Sidebar, pub status_bar: StatusBar, + pub toolbar: Toolbar, } #[derive(Clone, Deserialize, Default)] @@ -88,6 +89,11 @@ pub struct Tab { pub icon_conflict: Color, } +#[derive(Clone, Deserialize, Default)] +pub struct Toolbar { + pub height: f32, +} + #[derive(Clone, Deserialize, Default)] pub struct Find { #[serde(flatten)] diff --git a/crates/zed/assets/themes/_base.toml b/crates/zed/assets/themes/_base.toml index 360d5d03e1..69a938dacf 100644 --- a/crates/zed/assets/themes/_base.toml +++ b/crates/zed/assets/themes/_base.toml @@ -81,6 +81,9 @@ item_spacing = 24 cursor_position = "$text.2" diagnostic_message = "$text.2" +[workspace.toolbar] +height = 44 + [panel] padding = { top = 12, left = 12, bottom = 12, right = 12 } @@ -325,10 +328,14 @@ background = "$surface.1" [find.mode_button] extends = "$text.1" - -[find.mode_button_group] +padding = { left = 6, right = 6, top = 1, bottom = 1 } corner_radius = 6 border = { width = 1, color = "$border.0" } +margin.left = 1 +margin.right = 1 + +[find.mode_button_group] +padding = { left = 2, right = 2 } [find.active_mode_button] extends = "$find.mode_button" @@ -344,12 +351,14 @@ background = "$surface.2" [find.match_index] extends = "$text.1" +padding = 6 +margin.left = 24 [find.editor] max_width = 400 background = "$surface.0" corner_radius = 6 -padding = { left = 16, right = 16, top = 7, bottom = 7 } +padding = { left = 13, right = 13, top = 3, bottom = 3 } margin = { top = 5, bottom = 5, left = 5, right = 5 } text = "$text.0" placeholder_text = "$text.2"