git_ui: Layout/spacing tweaks for Blame tooltip (#40130)
# Why Spotted that spacing of different Blame tooltip elements are spaced uneven, also the fact that message content disappears on scroll before reaching border felt a bit odd. # How Layout/spacing tweaks for Blame tooltip. Release Notes: - Improved appearance of Git Blame tooltip. # Preview ### Before <img width="1034" height="702" alt="Screenshot 2025-10-13 at 20 01 07" src="https://github.com/user-attachments/assets/0c2715d5-d8fa-41dc-b891-a320a74d6fb0" /> <img width="1006" height="410" alt="Screenshot 2025-10-13 at 20 06 15" src="https://github.com/user-attachments/assets/8c16f6dc-58e5-46cc-83fb-dd71a63e7557" /> ### After <img width="1034" height="672" alt="Screenshot 2025-10-13 at 20 00 33" src="https://github.com/user-attachments/assets/e22e0e42-676e-411a-8773-2e57cdaaab17" /> <img width="1006" height="370" alt="Screenshot 2025-10-13 at 20 06 55" src="https://github.com/user-attachments/assets/761995a9-153a-4e5d-923b-e7fbd73dc475" /> --------- Co-authored-by: Danilo Leal <daniloleal09@gmail.com>
This commit is contained in:
Bartosz Kaszubowski
co-authored by
Danilo Leal
Danilo Leal
parent
da5f25d9b0
commit
474eb8db77
@@ -17,7 +17,7 @@ use settings::Settings as _;
|
||||
use theme::ThemeSettings;
|
||||
use time::OffsetDateTime;
|
||||
use time_format::format_local_timestamp;
|
||||
use ui::{ContextMenu, Divider, IconButtonShape, prelude::*, tooltip_container};
|
||||
use ui::{ContextMenu, Divider, prelude::*, tooltip_container};
|
||||
use workspace::Workspace;
|
||||
|
||||
const GIT_BLAME_MAX_AUTHOR_CHARS_DISPLAYED: usize = 20;
|
||||
@@ -61,16 +61,15 @@ impl BlameRenderer for GitBlameRenderer {
|
||||
.mr_2()
|
||||
.child(
|
||||
h_flex()
|
||||
.id(("blame", ix))
|
||||
.w_full()
|
||||
.gap_2()
|
||||
.justify_between()
|
||||
.font_family(style.font().family)
|
||||
.line_height(style.line_height)
|
||||
.id(("blame", ix))
|
||||
.text_color(cx.theme().status().hint)
|
||||
.gap_2()
|
||||
.child(
|
||||
h_flex()
|
||||
.items_center()
|
||||
.gap_2()
|
||||
.child(div().text_color(sha_color).child(short_commit_id))
|
||||
.children(avatar)
|
||||
@@ -250,20 +249,21 @@ impl BlameRenderer for GitBlameRenderer {
|
||||
};
|
||||
|
||||
Some(
|
||||
tooltip_container(cx, |d, cx| {
|
||||
d.occlude()
|
||||
tooltip_container(cx, |this, cx| {
|
||||
this.occlude()
|
||||
.on_mouse_move(|_, _, cx| cx.stop_propagation())
|
||||
.on_mouse_down(MouseButton::Left, |_, _, cx| cx.stop_propagation())
|
||||
.child(
|
||||
v_flex()
|
||||
.w(gpui::rems(30.))
|
||||
.gap_4()
|
||||
.child(
|
||||
h_flex()
|
||||
.pb_1p5()
|
||||
.gap_x_2()
|
||||
.pb_1()
|
||||
.gap_2()
|
||||
.overflow_x_hidden()
|
||||
.flex_wrap()
|
||||
.border_b_1()
|
||||
.border_color(cx.theme().colors().border_variant)
|
||||
.children(avatar)
|
||||
.child(author)
|
||||
.when(!author_email.is_empty(), |this| {
|
||||
@@ -272,30 +272,29 @@ impl BlameRenderer for GitBlameRenderer {
|
||||
.text_color(cx.theme().colors().text_muted)
|
||||
.child(author_email.to_owned()),
|
||||
)
|
||||
})
|
||||
.border_b_1()
|
||||
.border_color(cx.theme().colors().border_variant),
|
||||
}),
|
||||
)
|
||||
.child(
|
||||
div()
|
||||
.id("inline-blame-commit-message")
|
||||
.child(message)
|
||||
.track_scroll(&scroll_handle)
|
||||
.py_1p5()
|
||||
.max_h(message_max_height)
|
||||
.overflow_y_scroll()
|
||||
.track_scroll(&scroll_handle),
|
||||
.child(message),
|
||||
)
|
||||
.child(
|
||||
h_flex()
|
||||
.text_color(cx.theme().colors().text_muted)
|
||||
.w_full()
|
||||
.justify_between()
|
||||
.pt_1p5()
|
||||
.pt_1()
|
||||
.border_t_1()
|
||||
.border_color(cx.theme().colors().border_variant)
|
||||
.child(absolute_timestamp)
|
||||
.child(
|
||||
h_flex()
|
||||
.gap_1p5()
|
||||
.gap_1()
|
||||
.when_some(pull_request, |this, pr| {
|
||||
this.child(
|
||||
Button::new(
|
||||
@@ -306,24 +305,24 @@ impl BlameRenderer for GitBlameRenderer {
|
||||
.icon(IconName::PullRequest)
|
||||
.icon_color(Color::Muted)
|
||||
.icon_position(IconPosition::Start)
|
||||
.style(ButtonStyle::Subtle)
|
||||
.icon_size(IconSize::Small)
|
||||
.on_click(move |_, _, cx| {
|
||||
cx.stop_propagation();
|
||||
cx.open_url(pr.url.as_str())
|
||||
}),
|
||||
)
|
||||
.child(Divider::vertical())
|
||||
})
|
||||
.child(Divider::vertical())
|
||||
.child(
|
||||
Button::new(
|
||||
"commit-sha-button",
|
||||
short_commit_id.clone(),
|
||||
)
|
||||
.style(ButtonStyle::Subtle)
|
||||
.color(Color::Muted)
|
||||
.icon(IconName::FileGit)
|
||||
.icon_color(Color::Muted)
|
||||
.icon_position(IconPosition::Start)
|
||||
.icon_size(IconSize::Small)
|
||||
.on_click(move |_, window, cx| {
|
||||
CommitView::open(
|
||||
commit_summary.clone(),
|
||||
@@ -337,7 +336,6 @@ impl BlameRenderer for GitBlameRenderer {
|
||||
)
|
||||
.child(
|
||||
IconButton::new("copy-sha-button", IconName::Copy)
|
||||
.shape(IconButtonShape::Square)
|
||||
.icon_size(IconSize::Small)
|
||||
.icon_color(Color::Muted)
|
||||
.on_click(move |_, _, cx| {
|
||||
|
||||
Reference in New Issue
Block a user