From 0b4495a9206ef1fddd81112eace47730539b84de Mon Sep 17 00:00:00 2001
From: Danilo Leal <67129314+danilo-leal@users.noreply.github.com>
Date: Fri, 13 Dec 2024 00:52:12 -0300
Subject: [PATCH] zeta: Adjust the "Jump To Edit" button visuals (#21933)

| One Dark | One Light |
|--------|--------|
| <img width="1495" alt="Screenshot 2024-12-12 at 16 27 12"
src="https://github.com/user-attachments/assets/897ee786-a6f7-4d4e-8722-301ac13e6d8c"
/> | <img width="1495" alt="Screenshot 2024-12-12 at 16 27 18"
src="https://github.com/user-attachments/assets/a78aa5e4-f327-41da-bc9c-6e102bc67fe2"
/> |

| One Dark | One Light |
|--------|--------|
| <img width="1495" alt="Screenshot 2024-12-12 at 16 26 54"
src="https://github.com/user-attachments/assets/0357468e-7b5f-4f92-bcdb-5f94e353d8b2"
/> | <img width="1495" alt="Screenshot 2024-12-12 at 16 26 59"
src="https://github.com/user-attachments/assets/20e0f47e-e20f-46a7-b053-8e528b0975d7"
/> |


Release Notes:

- N/A
---
 crates/editor/src/element.rs | 47 +++++++++++++++++++++---------------
 1 file changed, 27 insertions(+), 20 deletions(-)

diff --git a/crates/editor/src/element.rs b/crates/editor/src/element.rs
index 26b5cae32d..6c049976bc 100644
--- a/crates/editor/src/element.rs
+++ b/crates/editor/src/element.rs
@@ -2755,22 +2755,34 @@ impl EditorElement {
 
         match &active_inline_completion.completion {
             InlineCompletion::Move(target_position) => {
-                let container_element = div()
-                    .bg(cx.theme().colors().editor_background)
+                let tab_kbd = h_flex()
+                    .px_0p5()
+                    .font(theme::ThemeSettings::get_global(cx).buffer_font.clone())
+                    .text_size(TextSize::XSmall.rems(cx))
+                    .text_color(cx.theme().colors().text.opacity(0.8))
+                    .child("tab");
+
+                let icon_container = div().mt(px(2.5)); // For optical alignment
+
+                let container_element = h_flex()
+                    .items_center()
+                    .py_0p5()
+                    .px_1()
+                    .gap_1()
+                    .bg(cx.theme().colors().editor_subheader_background)
                     .border_1()
-                    .border_color(cx.theme().colors().border)
+                    .border_color(cx.theme().colors().text_accent.opacity(0.2))
                     .rounded_md()
-                    .px_1();
+                    .shadow_sm();
 
                 let target_display_point = target_position.to_display_point(editor_snapshot);
                 if target_display_point.row().as_f32() < scroll_top {
                     let mut element = container_element
+                        .child(tab_kbd)
+                        .child(Label::new("Jump to Edit").size(LabelSize::Small))
                         .child(
-                            h_flex()
-                                .gap_1()
-                                .child(Icon::new(IconName::Tab))
-                                .child(Label::new("Jump to Edit"))
-                                .child(Icon::new(IconName::ArrowUp)),
+                            icon_container
+                                .child(Icon::new(IconName::ArrowUp).size(IconSize::Small)),
                         )
                         .into_any();
                     let size = element.layout_as_root(AvailableSpace::min_size(), cx);
@@ -2779,12 +2791,11 @@ impl EditorElement {
                     Some(element)
                 } else if (target_display_point.row().as_f32() + 1.) > scroll_bottom {
                     let mut element = container_element
+                        .child(tab_kbd)
+                        .child(Label::new("Jump to Edit").size(LabelSize::Small))
                         .child(
-                            h_flex()
-                                .gap_1()
-                                .child(Icon::new(IconName::Tab))
-                                .child(Label::new("Jump to Edit"))
-                                .child(Icon::new(IconName::ArrowDown)),
+                            icon_container
+                                .child(Icon::new(IconName::ArrowDown).size(IconSize::Small)),
                         )
                         .into_any();
                     let size = element.layout_as_root(AvailableSpace::min_size(), cx);
@@ -2796,12 +2807,8 @@ impl EditorElement {
                     Some(element)
                 } else {
                     let mut element = container_element
-                        .child(
-                            h_flex()
-                                .gap_1()
-                                .child(Icon::new(IconName::Tab))
-                                .child(Label::new("Jump to Edit")),
-                        )
+                        .child(tab_kbd)
+                        .child(Label::new("Jump to Edit").size(LabelSize::Small))
                         .into_any();
 
                     let target_line_end = DisplayPoint::new(