Yehowshua/ZIm
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

zeta: Refine visuals for the completion popover (#22142)

Browse source 
Most notably, trying out a different icon and adding the "Completion"
word to the side of the provider name.

<img width="800" alt="Screenshot 2024-12-17 at 13 04 55"
src="https://github.com/user-attachments/assets/6dcaa699-f358-4242-9812-e1668f426207"
/>

Release Notes:

- N/A
This commit is contained in:
Danilo Leal 2024-12-17 15:45:58 -03:00 • committed by GitHub
parent 7425d242bc
commit c86cf2c3e1
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 29 additions and 29 deletions
Download patch file Download diff file Expand all files Collapse all files

5
assets/icons/zed_predict.svg
View file

@ -1,4 +1,5 @@
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M8 8.9V11C5.93097 11 5.06903 11 3 11V10.4L8 5.6V5H3V7.1" stroke="black" stroke-width="1.5"/>
<path d="M11 5L13 8L11 11" stroke="black" stroke-width="1.5"/>
<path d="M7 8.9V11C5.34478 11 4.65522 11 3 11V10.4L7 5.6V5H3V7.1" stroke="black" stroke-width="1.5"/>
<path d="M12 5L14 8L12 11" stroke="black" stroke-width="1.5"/>
<path d="M10 6.5L11 8L10 9.5" stroke="black" stroke-width="1.5"/>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 268 B

After

Width:  |  Height:  |  Size: 334 B

Before After
Before After

53
crates/editor/src/code_context_menus.rs
View file

@ -14,11 +14,7 @@ use multi_buffer::{Anchor, ExcerptId};
use ordered_float::OrderedFloat;
use project::{CodeAction, Completion, TaskSourceKind};
use task::ResolvedTask;
use ui::{
h_flex, ActiveTheme as _, Color, FluentBuilder as _, InteractiveElement as _, IntoElement,
Label, LabelCommon as _, LabelSize, ListItem, ParentElement as _, Popover,
StatefulInteractiveElement as _, Styled, Toggleable as _,
};
use ui::{prelude::*, Color, IntoElement, ListItem, Popover, Styled};
use util::ResultExt as _;
use workspace::Workspace;
@ -425,8 +421,10 @@ impl CompletionsMenu {
CompletionEntry::InlineCompletionHint(hint) => Some(match &hint.text {
InlineCompletionText::Edit { text, highlights } => div()
.my_1()
.rounded_md()
.rounded(px(6.))
.bg(cx.theme().colors().editor_background)
.border_1()
.border_color(cx.theme().colors().border_variant)
.child(
gpui::StyledText::new(text.clone())
.with_highlights(&style.text, highlights.clone()),
@ -451,9 +449,8 @@ impl CompletionsMenu {
.flex_1()
.px_1p5()
.py_1()
.min_w(px(260.))
.max_w(px(640.))
.w(px(500.))
.w(px(450.))
.overflow_y_scroll()
.occlude()
});
@ -513,6 +510,7 @@ impl CompletionsMenu {
(range, highlight)
}),
);
let completion_label =
StyledText::new(completion.label.text.clone())
.with_highlights(&style.text, highlights);
@ -559,25 +557,26 @@ impl CompletionsMenu {
CompletionEntry::InlineCompletionHint(InlineCompletionMenuHint {
provider_name,
..
}) => div()
.min_w(px(250.))
.max_w(px(500.))
.pb_1()
.border_b_1()
.border_color(cx.theme().colors().border_variant)
.child(
ListItem::new("inline-completion")
.inset(true)
.toggle_state(item_ix == selected_item)
.on_click(cx.listener(move |editor, _event, cx| {
cx.stop_propagation();
editor.accept_inline_completion(
&AcceptInlineCompletion {},
cx,
);
}))
.child(Label::new(SharedString::new_static(provider_name))),
),
}) => div().min_w(px(250.)).max_w(px(500.)).child(
ListItem::new("inline-completion")
.inset(true)
.toggle_state(item_ix == selected_item)
.start_slot(Icon::new(IconName::ZedPredict))
.child(
StyledText::new(format!(
"{} Completion",
SharedString::new_static(provider_name)
))
.with_highlights(&style.text, None),
)
.on_click(cx.listener(move |editor, _event, cx| {
cx.stop_propagation();
editor.accept_inline_completion(
&AcceptInlineCompletion {},
cx,
);
})),
),
}
})
.collect()