mirrors/zed
1
0
Fork 0
mirror of https://github.com/zed-industries/zed.git synced 2024-12-29 12:38:02 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 9

Iterate on design of project search bar (#3913)

Browse source 
This PR iterates on the design of the project search bar:

- Mode selections have been updated to use `ToggleButton`s
- Spacing has been added between the various elements.

Release Notes:

- Improved the look of the project search bar.
This commit is contained in:
Marshall Bowers 2024-01-05 11:48:52 -05:00 committed by GitHub
parent 5935979a96
commit ea43d7a5c6
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 24 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

31
crates/search/src/project_search.rs
View file

@ -38,8 +38,8 @@ use std::{
use theme::ThemeSettings; use theme::ThemeSettings;
use ui::{ use ui::{
h_stack, prelude::*, v_stack, Button, Icon, IconButton, IconElement, Label, LabelCommon, h_stack, prelude::*, v_stack, Icon, IconButton, IconElement, Label, LabelCommon, LabelSize,
LabelSize, Selectable, Tooltip, Selectable, ToggleButton, Tooltip,
}; };
use util::{paths::PathMatcher, ResultExt as _}; use util::{paths::PathMatcher, ResultExt as _};
use workspace::{ use workspace::{
@ -1676,20 +1676,26 @@ impl Render for ProjectSearchBar {
let mode_column = v_stack().items_start().justify_start().child( let mode_column = v_stack().items_start().justify_start().child(
h_stack() h_stack()
.gap_2()
.child( .child(
h_stack() h_stack()
.child( .child(
Button::new("project-search-text-button", "Text") ToggleButton::new("project-search-text-button", "Text")
.style(ButtonStyle::Filled)
.size(ButtonSize::Large)
.selected(search.current_mode == SearchMode::Text) .selected(search.current_mode == SearchMode::Text)
.on_click(cx.listener(|this, _, cx| { .on_click(cx.listener(|this, _, cx| {
this.activate_search_mode(SearchMode::Text, cx) this.activate_search_mode(SearchMode::Text, cx)
})) }))
.tooltip(|cx| { .tooltip(|cx| {
Tooltip::for_action("Toggle text search", &ActivateTextMode, cx) Tooltip::for_action("Toggle text search", &ActivateTextMode, cx)
}), })
.first(),
) )
.child( .child(
Button::new("project-search-regex-button", "Regex") ToggleButton::new("project-search-regex-button", "Regex")
.style(ButtonStyle::Filled)
.size(ButtonSize::Large)
.selected(search.current_mode == SearchMode::Regex) .selected(search.current_mode == SearchMode::Regex)
.on_click(cx.listener(|this, _, cx| { .on_click(cx.listener(|this, _, cx| {
this.activate_search_mode(SearchMode::Regex, cx) this.activate_search_mode(SearchMode::Regex, cx)
@ -1700,11 +1706,20 @@ impl Render for ProjectSearchBar {
&ActivateRegexMode, &ActivateRegexMode,
cx, cx,
) )
})
.map(|this| {
if semantic_is_available {
this.middle()
} else {
this.last()
}
}), }),
) )
.when(semantic_is_available, |this| { .when(semantic_is_available, |this| {
this.child( this.child(
Button::new("project-search-semantic-button", "Semantic") ToggleButton::new("project-search-semantic-button", "Semantic")
.style(ButtonStyle::Filled)
.size(ButtonSize::Large)
.selected(search.current_mode == SearchMode::Semantic) .selected(search.current_mode == SearchMode::Semantic)
.on_click(cx.listener(|this, _, cx| { .on_click(cx.listener(|this, _, cx| {
this.activate_search_mode(SearchMode::Semantic, cx) this.activate_search_mode(SearchMode::Semantic, cx)
@ -1715,7 +1730,8 @@ impl Render for ProjectSearchBar {
&ActivateSemanticMode, &ActivateSemanticMode,
cx, cx,
) )
}), })
.last(),
) )
}), }),
) )
@ -1866,6 +1882,7 @@ impl Render for ProjectSearchBar {
.child( .child(
h_stack() h_stack()
.justify_between() .justify_between()
.gap_2()
.child(query_column) .child(query_column)
.child(mode_column) .child(mode_column)
.child(replace_column) .child(replace_column)