mirrors/zed
1
0
Fork 0
mirror of https://github.com/zed-industries/zed.git synced 2024-12-31 21:36:26 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 10

Style dismiss button.

Browse source 
Fix clipping in nav buttons and mode buttons. Add missing borders to outskirts of mode buttons.
This commit is contained in:
Piotr Osiewicz 2023-08-13 01:06:35 +02:00
parent c6425b36da
commit e151555542
4 changed files with 69 additions and 64 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
crates/search/src/mode.rs
View file

@ -49,14 +49,14 @@ impl SearchMode {
}
}
pub(crate) fn border_left(&self) -> bool {
pub(crate) fn border_right(&self) -> bool {
match self {
SearchMode::Text => false,
_ => true,
}
}
pub(crate) fn border_right(&self) -> bool {
pub(crate) fn border_left(&self) -> bool {
match self {
SearchMode::Regex => false,
_ => true,

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

@ -1590,10 +1590,10 @@ impl View for ProjectSearchBar {
.with_children(matches)
.aligned()
.top()
.left(),
.left()
.constrained()
.with_height(theme.search.search_bar_row_height),
)
.constrained()
.with_height(theme.search.search_bar_row_height)
.flex(1., true),
)
.with_child(
@ -1627,23 +1627,36 @@ impl View for ProjectSearchBar {
.with_child(
Flex::row()
.align_children_center()
.with_child(search_button_for_mode(SearchMode::Text, cx))
.with_children(semantic_index)
.with_child(search_button_for_mode(SearchMode::Regex, cx))
.with_child(super::search_bar::render_close_button(
"Dismiss Project Search",
&theme.search,
cx,
|_, this, cx| {
if let Some(search) = this.active_project_search.as_mut() {
search.update(cx, |_, cx| cx.emit(ViewEvent::Dismiss))
}
},
None,
))
.with_child(
Flex::row()
.with_child(search_button_for_mode(SearchMode::Text, cx))
.with_children(semantic_index)
.with_child(search_button_for_mode(SearchMode::Regex, cx))
.aligned()
.left()
.contained()
.with_margin_right(3.),
)
.with_child(
super::search_bar::render_close_button(
"Dismiss Project Search",
&theme.search,
cx,
|_, this, cx| {
if let Some(search) =
this.active_project_search.as_mut()
{
search
.update(cx, |_, cx| cx.emit(ViewEvent::Dismiss))
}
},
None,
)
.aligned()
.right(),
)
.constrained()
.with_height(theme.search.search_bar_row_height)
.contained()
.aligned()
.right()
.top()

53
crates/search/src/search_bar.rs
View file

@ -28,10 +28,10 @@ pub(super) fn render_close_button<V: View>(
.constrained()
.with_width(style.icon_width)
.aligned()
.constrained()
.with_width(style.button_width)
.contained()
.with_style(style.container)
.constrained()
.with_height(theme.search_bar_row_height)
})
.on_click(MouseButton::Left, on_click)
.with_cursor_style(CursorStyle::PointingHand)
@ -66,30 +66,19 @@ pub(super) fn render_nav_button<V: View>(
let style = theme.search.nav_button.style_for(state).clone();
let mut container_style = style.container.clone();
let label = Label::new(icon, style.label.clone()).contained();
match direction {
Direction::Prev => {
container_style.corner_radii = CornerRadii {
bottom_right: 0.,
top_right: 0.,
..container_style.corner_radii
};
Flex::row()
.with_child(label.with_style(container_style))
.constrained()
//.with_height(theme.workspace.toolbar.height)
}
Direction::Next => {
container_style.corner_radii = CornerRadii {
bottom_left: 0.,
top_left: 0.,
..container_style.corner_radii
};
Flex::row()
.with_child(label.with_style(container_style))
.constrained()
// .with_height(theme.workspace.toolbar.height)
}
}
container_style.corner_radii = match direction {
Direction::Prev => CornerRadii {
bottom_right: 0.,
top_right: 0.,
..container_style.corner_radii
},
Direction::Next => CornerRadii {
bottom_left: 0.,
top_left: 0.,
..container_style.corner_radii
},
};
label.with_style(container_style)
})
.on_click(MouseButton::Left, on_click)
.with_cursor_style(CursorStyle::PointingHand)
@ -132,24 +121,18 @@ pub(crate) fn render_search_mode_button<V: View>(
top_right: 0.,
..container_style.corner_radii
};
Flex::row()
.align_children_center()
.with_child(label.with_style(container_style))
.into_any()
label.with_style(container_style)
} else {
container_style.corner_radii = CornerRadii {
bottom_left: 0.,
top_left: 0.,
..container_style.corner_radii
};
Flex::row()
.align_children_center()
.with_child(label.with_style(container_style))
.into_any()
label.with_style(container_style)
}
} else {
container_style.corner_radii = CornerRadii::default();
label.with_style(container_style).into_any()
label.with_style(container_style)
}
})
.on_click(MouseButton::Left, on_click)

27
styles/src/style_tree/search.ts
View file

@ -161,19 +161,28 @@ export default function search(): any {
dismiss_button: interactive({
base: {
color: foreground(theme.highest, "variant"),
icon_width: 12,
button_width: 14,
icon_width: 14,
button_width: 32,
corner_radius: 6,
padding: {
left: 10,
right: 10,
top: 8,
bottom: 8,
left: 8,
right: 8,
},
background: background(theme.highest, "variant"),
border: border(theme.highest, "on"),
},
state: {
hovered: {
color: foreground(theme.highest, "hovered"),
background: background(theme.highest, "variant", "hovered")
},
clicked: {
color: foreground(theme.highest, "pressed"),
background: background(theme.highest, "variant", "pressed")
},
},
}),
@ -245,7 +254,7 @@ export default function search(): any {
base: {
text: text(theme.highest, "mono", "on"),
background: background(theme.highest, "on"),
corner_radius: { top_left: 6, top_right: 6, bottom_right: 6, bottom_left: 6 },
corner_radius: 6,
border: {
...border(theme.highest, "on"),
left: false,
@ -253,10 +262,10 @@ export default function search(): any {
},
padding: {
bottom: 6,
left: 6,
right: 6,
top: 6,
bottom: 3,
left: 10,
right: 10,
top: 3,
},
},
state: {