mirror of
https://github.com/zed-industries/zed.git
synced 2024-12-28 20:01:33 +00:00
Move buttons inside of query editor (WIP)
This commit is contained in:
Piotr Osiewicz
parent
52a48de9ca
commit
a33d8519f2
3 changed files with 90 additions and 44 deletions
6
assets/icons/word_search_14.svg
Normal file
6
assets/icons/word_search_14.svg
Normal file
|
|
@ -0,0 +1,6 @@
|
|||
<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M4.74672 9.48686L4.07031 6.03232L3.38584 9.48686H2.17614L1.00281 4.00781H2.27559L2.81566 7.41754L3.48439 4.01752H4.65865L5.31819 7.41176L5.85736 4.00781H7.13014L5.9568 9.48686H4.74672Z" fill="#787D87"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M8.64907 9.32382C8.313 9.13287 8.08213 8.81954 7.94725 8.4078C7.8147 8.00318 7.75317 7.44207 7.75317 6.73677C7.75317 6.03845 7.81141 5.48454 7.9369 5.08716L7.93755 5.08512C8.07231 4.67373 8.3034 4.36258 8.64088 4.17794C8.96806 3.99257 9.41119 3.9104 9.9496 3.9104C10.3406 3.9104 10.6632 3.95585 10.8967 4.06485C11.0079 4.11675 11.1099 4.18844 11.2033 4.27745V2.03027H12.4077V9.4856H11.2033V9.18983C11.0945 9.29074 10.98 9.37096 10.8591 9.42752C10.6327 9.53648 10.3335 9.58252 9.97867 9.58252C9.4339 9.58252 8.98592 9.50355 8.65375 9.3264L8.64907 9.32382ZM11.1139 7.85508C11.1841 7.60311 11.2227 7.23354 11.2227 6.73677C11.2227 6.24602 11.1841 5.88331 11.1141 5.63844C11.0457 5.39902 10.9401 5.25863 10.8149 5.18266L10.8077 5.17826C10.6804 5.09342 10.4713 5.03726 10.1531 5.03726C9.80785 5.03726 9.5719 5.09359 9.42256 5.1832L9.41829 5.18576C9.28002 5.26412 9.16722 5.40602 9.09399 5.64263C9.01876 5.88566 8.97694 6.24668 8.97694 6.73677C8.97694 7.23363 9.01882 7.59774 9.09399 7.8406C9.1673 8.07745 9.28097 8.22477 9.42256 8.30972C9.5719 8.39933 9.80785 8.45566 10.1531 8.45566C10.4721 8.45566 10.683 8.40265 10.8114 8.32216C10.9396 8.23944 11.0456 8.09373 11.1139 7.85508Z" fill="#787D87"/>
|
||||
<rect x="1.14087" y="10.7188" width="11.7183" height="1.26565" rx="0.632824" fill="#787D87"/>
|
||||
</svg>
|
||||
|
||||
|
After Width: | Height: | Size: 1.7 KiB |
|
|
@ -1149,6 +1149,38 @@ impl ProjectSearchBar {
|
|||
)
|
||||
.into_any()
|
||||
}
|
||||
fn render_option_button_icon(
|
||||
&self,
|
||||
icon: &'static str,
|
||||
option: SearchOptions,
|
||||
cx: &mut ViewContext<Self>,
|
||||
) -> AnyElement<Self> {
|
||||
let tooltip_style = theme::current(cx).tooltip.clone();
|
||||
let is_active = self.is_option_enabled(option, cx);
|
||||
MouseEventHandler::<Self, _>::new(option.bits as usize, cx, |state, cx| {
|
||||
let theme = theme::current(cx);
|
||||
let style = theme
|
||||
.search
|
||||
.option_button
|
||||
.in_state(is_active)
|
||||
.style_for(state);
|
||||
Svg::new(icon).with_color(style.text.color.clone())
|
||||
.contained()
|
||||
.with_style(style.container)
|
||||
})
|
||||
.on_click(MouseButton::Left, move |_, this, cx| {
|
||||
this.toggle_search_option(option, cx);
|
||||
})
|
||||
.with_cursor_style(CursorStyle::PointingHand)
|
||||
.with_tooltip::<Self>(
|
||||
option.bits as usize,
|
||||
format!("Toggle {}", option.label()),
|
||||
Some(option.to_toggle_action()),
|
||||
tooltip_style,
|
||||
cx,
|
||||
)
|
||||
.into_any()
|
||||
}
|
||||
|
||||
fn render_option_button(
|
||||
&self,
|
||||
|
|
@ -1272,8 +1304,8 @@ impl View for ProjectSearchBar {
|
|||
}
|
||||
|
||||
fn render(&mut self, cx: &mut ViewContext<Self>) -> AnyElement<Self> {
|
||||
if let Some(search) = self.active_project_search.as_ref() {
|
||||
let search = search.read(cx);
|
||||
if let Some(_search) = self.active_project_search.as_ref() {
|
||||
let search = _search.read(cx);
|
||||
let theme = theme::current(cx).clone();
|
||||
let query_container_style = if search.panels_with_errors.contains(&InputPanel::Query) {
|
||||
theme.search.invalid_editor
|
||||
|
|
@ -1301,12 +1333,53 @@ impl View for ProjectSearchBar {
|
|||
.aligned()
|
||||
.right()
|
||||
.flex(1.0, true);
|
||||
|
||||
let regex_button = self.render_option_button("Regex", SearchOptions::REGEX, cx);
|
||||
let row_spacing = theme.workspace.toolbar.container.padding.bottom;
|
||||
let query = ChildView::new(&search.query_editor, cx)
|
||||
let search = _search.read(cx);
|
||||
let filter_button = {
|
||||
let tooltip_style = theme::current(cx).tooltip.clone();
|
||||
let is_active = search.filters_enabled;
|
||||
MouseEventHandler::<Self, _>::new(0, cx, |state, cx| {
|
||||
let theme = theme::current(cx);
|
||||
let style = theme
|
||||
.search
|
||||
.option_button
|
||||
.in_state(is_active)
|
||||
.style_for(state);
|
||||
Svg::new("icons/filter_12.svg")
|
||||
.with_color(style.text.color.clone())
|
||||
.contained()
|
||||
.with_style(style.container)
|
||||
})
|
||||
.on_click(MouseButton::Left, move |_, this, cx| {
|
||||
this.toggle_filters(cx);
|
||||
})
|
||||
.with_cursor_style(CursorStyle::PointingHand)
|
||||
.with_tooltip::<Self>(0, "Toggle filters".into(), None, tooltip_style, cx)
|
||||
.into_any()
|
||||
}; let search = _search.read(cx);
|
||||
let query = Flex::row()
|
||||
.with_child(
|
||||
ChildView::new(&search.query_editor, cx)
|
||||
.constrained()
|
||||
.flex(1., true)
|
||||
.into_any(),
|
||||
)
|
||||
.with_child(
|
||||
Flex::row()
|
||||
.with_children([
|
||||
filter_button,
|
||||
self.render_option_button("Case", SearchOptions::CASE_SENSITIVE, cx),
|
||||
self.render_option_button_icon("icons/word_search_14.svg", SearchOptions::WHOLE_WORD, cx),
|
||||
|
||||
])
|
||||
.flex(1., true)
|
||||
.contained(),
|
||||
)
|
||||
.aligned()
|
||||
.left()
|
||||
.flex(1., true);
|
||||
let search = _search.read(cx);
|
||||
let matches = search.active_match_index.map(|match_ix| {
|
||||
Label::new(
|
||||
format!(
|
||||
|
|
@ -1321,6 +1394,7 @@ impl View for ProjectSearchBar {
|
|||
.aligned()
|
||||
.left()
|
||||
});
|
||||
|
||||
let filters = search.filters_enabled.then(|| {
|
||||
Flex::row()
|
||||
.with_child(
|
||||
|
|
@ -1346,30 +1420,6 @@ impl View for ProjectSearchBar {
|
|||
.flex(1., false),
|
||||
)
|
||||
});
|
||||
let filter_button = {
|
||||
let tooltip_style = theme::current(cx).tooltip.clone();
|
||||
let is_active = search.filters_enabled;
|
||||
MouseEventHandler::<Self, _>::new(0, cx, |state, cx| {
|
||||
let theme = theme::current(cx);
|
||||
let style = theme
|
||||
.search
|
||||
.option_button
|
||||
.in_state(is_active)
|
||||
.style_for(state);
|
||||
Label::new("Filter", style.text.clone())
|
||||
.contained()
|
||||
.with_style(style.container)
|
||||
})
|
||||
.on_click(MouseButton::Left, move |_, this, cx| {
|
||||
this.toggle_filters(cx);
|
||||
})
|
||||
.with_cursor_style(CursorStyle::PointingHand)
|
||||
.with_tooltip::<Self>(0, "Toggle filters".into(), None, tooltip_style, cx)
|
||||
.into_any()
|
||||
};
|
||||
let case_button = self.render_option_button("Case", SearchOptions::CASE_SENSITIVE, cx);
|
||||
let word_button = self.render_option_button("Word", SearchOptions::WHOLE_WORD, cx);
|
||||
let regex_button = self.render_option_button("Regex", SearchOptions::REGEX, cx);
|
||||
|
||||
let semantic_index =
|
||||
SemanticIndex::enabled(cx).then(|| self.render_semantic_search_button(cx));
|
||||
|
|
@ -1409,16 +1459,6 @@ impl View for ProjectSearchBar {
|
|||
))
|
||||
.aligned(),
|
||||
)
|
||||
.with_child(
|
||||
Flex::row()
|
||||
.with_child(case_button)
|
||||
.with_child(word_button)
|
||||
.with_child(filter_button)
|
||||
.contained()
|
||||
.with_style(theme.search.option_button_group)
|
||||
.aligned()
|
||||
.right(),
|
||||
)
|
||||
.contained()
|
||||
.with_margin_bottom(row_spacing),
|
||||
)
|
||||
|
|
|
|||
|
|
@ -44,17 +44,17 @@ export default function search(): any {
|
|||
base: {
|
||||
...text(theme.highest, "mono", "on"),
|
||||
background: background(theme.highest, "on"),
|
||||
corner_radius: 6,
|
||||
corner_radius: 2,
|
||||
border: border(theme.highest, "on"),
|
||||
margin: {
|
||||
right: 4,
|
||||
},
|
||||
padding: {
|
||||
bottom: 2,
|
||||
left: 10,
|
||||
right: 10,
|
||||
top: 2,
|
||||
},
|
||||
bottom: 6,
|
||||
left: 6,
|
||||
right: 6,
|
||||
top: 6,
|
||||
},
|
||||
},
|
||||
state: {
|
||||
hovered: {
|
||||
|
|
|
|||
Loading…
Reference in a new issue