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

assistant2: Adjust text and padding alignment between messages (#27067)

Browse source 
Ensuring that text between the "you" messages align with text in the
assistant response. This also creates a nice subtle hierarchy effect
where the "you" message card is wider than the message, making it
slightly easier to tell them apart.

<img
src="https://github.com/user-attachments/assets/616c1776-ca51-454e-9d52-e480bf26c843"
width="600px" />

Release Notes:

- N/A
This commit is contained in:
Danilo Leal 2025-03-19 09:43:33 -03:00 • committed by GitHub
parent 1d33bfde37
commit 3874d315ec
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 9 additions and 8 deletions
Download patch file Download diff file Expand all files Collapse all files

17
crates/assistant2/src/active_thread.rs
View file

@ -583,7 +583,7 @@ impl ActiveThread {
.p_2p5() .p_2p5()
.child(edit_message_editor) .child(edit_message_editor)
} else { } else {
div().p_2p5().text_ui(cx).child(markdown.clone()) div().text_ui(cx).child(markdown.clone())
}, },
) )
.when_some(context, |parent, context| { .when_some(context, |parent, context| {
@ -603,15 +603,16 @@ impl ActiveThread {
let styled_message = match message.role { let styled_message = match message.role {
Role::User => v_flex() Role::User => v_flex()
.id(("message-container", ix)) .id(("message-container", ix))
.pt_2p5() .pt_2()
.px_2p5() .pl_2()
.pr_2p5()
.child( .child(
v_flex() v_flex()
.bg(colors.editor_background) .bg(colors.editor_background)
.rounded_lg() .rounded_lg()
.border_1() .border_1()
.border_color(colors.border) .border_color(colors.border)
.shadow_sm() .shadow_md()
.child( .child(
h_flex() h_flex()
.py_1() .py_1()
@ -702,12 +703,12 @@ impl ActiveThread {
}, },
), ),
) )
.child(message_content), .child(div().p_2().child(message_content)),
), ),
Role::Assistant => { Role::Assistant => {
v_flex() v_flex()
.id(("message-container", ix)) .id(("message-container", ix))
.child(message_content) .child(div().py_3().px_4().child(message_content))
.when( .when(
!tool_uses.is_empty() || !scripting_tool_uses.is_empty(), !tool_uses.is_empty() || !scripting_tool_uses.is_empty(),
|parent| { |parent| {
@ -729,7 +730,7 @@ impl ActiveThread {
v_flex() v_flex()
.bg(colors.editor_background) .bg(colors.editor_background)
.rounded_sm() .rounded_sm()
.child(message_content), .child(div().p_4().child(message_content)),
), ),
}; };
@ -745,7 +746,7 @@ impl ActiveThread {
let lighter_border = cx.theme().colors().border.opacity(0.5); let lighter_border = cx.theme().colors().border.opacity(0.5);
div().px_2p5().child( div().px_4().child(
v_flex() v_flex()
.rounded_lg() .rounded_lg()
.border_1() .border_1()