Fix overlap (#10474)

Conrad Irwin created 2 years ago

Although I liked the symmetry of the count in the middle of the arrows,
it's
tricky to make the buttons not occlude the count on hover, so go back to
this arrangement.

Release Notes:

- N/A

Change summary

crates/search/src/buffer_search.rs  | 27 ++++++++++-----------------
crates/search/src/project_search.rs | 25 +++++++++++--------------
2 files changed, 21 insertions(+), 31 deletions(-)

Detailed changes

crates/search/src/buffer_search.rs

@@ -272,28 +272,21 @@ impl Render for BufferSearchBar {
                         "Select previous match",
                         &SelectPrevMatch,
                     ))
-                    .when(!narrow_mode, |this| {
-                        this.child(
-                            h_flex()
-                                .mx(rems_from_px(-4.0))
-                                .min_w(rems_from_px(40.))
-                                .justify_center()
-                                .items_center()
-                                .child(Label::new(match_text).color(
-                                    if self.active_match_index.is_some() {
-                                        Color::Default
-                                    } else {
-                                        Color::Disabled
-                                    },
-                                )),
-                        )
-                    })
                     .child(render_nav_button(
                         ui::IconName::ChevronRight,
                         self.active_match_index.is_some(),
                         "Select next match",
                         &SelectNextMatch,
-                    )),
+                    ))
+                    .when(!narrow_mode, |this| {
+                        this.child(h_flex().min_w(rems_from_px(40.)).child(
+                            Label::new(match_text).color(if self.active_match_index.is_some() {
+                                Color::Default
+                            } else {
+                                Color::Disabled
+                            }),
+                        ))
+                    }),
             );
 
         let replace_line = should_show_replace_input.then(|| {

crates/search/src/project_search.rs

@@ -1437,20 +1437,6 @@ impl Render for ProjectSearchBar {
                         Tooltip::for_action("Go to previous match", &SelectPrevMatch, cx)
                     }),
             )
-            .child(
-                h_flex()
-                    .mx(rems_from_px(-4.0))
-                    .min_w(rems_from_px(40.))
-                    .justify_center()
-                    .items_center()
-                    .child(
-                        Label::new(match_text).color(if search.active_match_index.is_some() {
-                            Color::Default
-                        } else {
-                            Color::Disabled
-                        }),
-                    ),
-            )
             .child(
                 IconButton::new("project-search-next-match", IconName::ChevronRight)
                     .disabled(search.active_match_index.is_none())
@@ -1463,6 +1449,17 @@ impl Render for ProjectSearchBar {
                     }))
                     .tooltip(|cx| Tooltip::for_action("Go to next match", &SelectNextMatch, cx)),
             )
+            .child(
+                h_flex()
+                    .min_w(rems_from_px(40.))
+                    .child(
+                        Label::new(match_text).color(if search.active_match_index.is_some() {
+                            Color::Default
+                        } else {
+                            Color::Disabled
+                        }),
+                    ),
+            )
             .when(limit_reached, |this| {
                 this.child(
                     div()