zed-industries/zed
1
1
Fork 0
mirror of https://github.com/zed-industries/zed.git synced 2024-11-07 20:39:04 +03:00
Code Issues Packages Projects Releases Wiki Activity

Change styling of match nav buttons

Browse Source 
Co-authored-by: Kyle <kyle@zed.dev>
This commit is contained in:
Piotr Osiewicz 2023-08-04 17:35:59 +02:00
parent 2c0e3886a5
commit 82eb6d8bc3
3 changed files with 94 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

83
crates/search/src/project_search.rs
View File

@ -1531,6 +1531,7 @@ impl ProjectSearchBar {
) -> AnyElement<Self> {
let action: Box<dyn Action>;
let tooltip;
match direction {
Direction::Prev => {
action = Box::new(SelectPrevMatch);
@ -1546,10 +1547,51 @@ impl ProjectSearchBar {
enum NavButton {}
MouseEventHandler::<NavButton, _>::new(direction as usize, cx, |state, cx| {
let theme = theme::current(cx);
let style = theme.search.option_button.inactive_state().style_for(state);
Label::new(icon, style.text.clone())
let mut style = theme.search.nav_button.style_for(state).clone();
match direction {
Direction::Prev => style.container.border.left = false,
Direction::Next => style.container.border.right = false,
};
let mut label = Label::new(icon, style.label.clone())
.contained()
.with_style(style.container)
.with_style(style.container.clone());
match direction {
Direction::Prev => Flex::row()
.with_child(
ButtonSide::left(
style
.clone()
.container
.background_color
.unwrap_or_else(gpui::color::Color::transparent_black),
)
.with_border(style.container.border.width, style.container.border.color)
.contained()
.constrained()
.with_max_width(theme.search.mode_filling_width),
)
.with_child(label)
.constrained()
.with_height(theme.workspace.toolbar.height),
Direction::Next => Flex::row()
.with_child(label)
.with_child(
ButtonSide::right(
style
.clone()
.container
.background_color
.unwrap_or_else(gpui::color::Color::transparent_black),
)
.with_border(style.container.border.width, style.container.border.color)
.contained()
.constrained()
.with_max_width(theme.search.mode_filling_width),
)
.constrained()
.with_height(theme.workspace.toolbar.height),
}
})
.on_click(MouseButton::Left, move |_, this, cx| {
if let Some(search) = this.active_project_search.as_ref() {
@ -1911,7 +1953,26 @@ impl View for ProjectSearchBar {
Flex::row()
.with_child(
Flex::column()
.with_child(Flex::row().with_children(matches).aligned().left())
.with_child(
Flex::row()
.with_child(
Flex::row()
.with_child(self.render_nav_button(
"<",
Direction::Prev,
cx,
))
.with_child(self.render_nav_button(
">",
Direction::Next,
cx,
))
.aligned(),
)
.with_children(matches)
.aligned()
.left(),
)
.flex(1., true),
)
.with_child(
@ -1929,20 +1990,6 @@ impl View for ProjectSearchBar {
.with_max_width(theme.search.editor.max_width)
.flex(1., false),
)
.with_child(
Flex::row()
.with_child(self.render_nav_button(
"<",
Direction::Prev,
cx,
))
.with_child(self.render_nav_button(
">",
Direction::Next,
cx,
))
.aligned(),
)
.contained()
.with_margin_bottom(row_spacing),
)

1
crates/theme/src/theme.rs
View File

@ -389,6 +389,7 @@ pub struct Search {
pub editor_icon: IconStyle,
pub mode_button: Toggleable<Interactive<ContainedText>>,
pub mode_filling_width: f32,
pub nav_button: Interactive<ContainedLabel>,
}
#[derive(Clone, Deserialize, Default, JsonSchema)]

28
styles/src/style_tree/search.ts
View File

@ -225,5 +225,33 @@ export default function search(): any {
},
}),
mode_filling_width: 4.0,
nav_button: interactive({
base: {
text: text(theme.highest, "mono", "on"),
background: background(theme.highest, "on"),
corner_radius: 2,
border: border(theme.highest, "on"),
padding: {
bottom: 6,
left: 6,
right: 6,
top: 6,
},
},
state: {
hovered: {
...text(theme.highest, "mono", "on", "hovered"),
background: background(theme.highest, "on", "hovered"),
border: border(theme.highest, "on", "hovered"),
},
clicked: {
...text(theme.highest, "mono", "on", "pressed"),
background: background(theme.highest, "on", "pressed"),
border: border(theme.highest, "on", "pressed"),
},
},
}),
}
}