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

Style header for assistant2 (#11570)

Browse source 
Release Notes:

- N/A
This commit is contained in:
Nate Butler 2024-05-08 14:17:07 -04:00 • committed by GitHub
parent ec3aabe2c2
commit d103903229
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 105 additions and 64 deletions
Download patch file Download diff file Expand all files Collapse all files

50
crates/assistant2/src/assistant2.rs
View file

@ -975,6 +975,8 @@ impl AssistantChat {
impl Render for AssistantChat { impl Render for AssistantChat {
fn render(&mut self, cx: &mut ViewContext<Self>) -> impl IntoElement { fn render(&mut self, cx: &mut ViewContext<Self>) -> impl IntoElement {
let header_height = Spacing::Small.rems(cx) * 2.0 + ButtonSize::Default.rems();
div() div()
.relative() .relative()
.flex_1() .flex_1()
@ -983,23 +985,51 @@ impl Render for AssistantChat {
.on_action(cx.listener(Self::submit)) .on_action(cx.listener(Self::submit))
.on_action(cx.listener(Self::cancel)) .on_action(cx.listener(Self::cancel))
.text_color(Color::Default.color(cx)) .text_color(Color::Default.color(cx))
.child(list(self.list_state.clone()).flex_1().pt(header_height))
.child( .child(
h_flex() h_flex()
.gap_2() .absolute()
.top_0()
.justify_between()
.w_full()
.h(header_height)
.p(Spacing::Small.rems(cx))
.child( .child(
Button::new("open-saved-conversations", "Saved Conversations").on_click( IconButton::new("open-saved-conversations", IconName::ChevronLeft)
|_event, cx| cx.dispatch_action(Box::new(ToggleSavedConversations)), .on_click(|_event, cx| {
), cx.dispatch_action(Box::new(ToggleSavedConversations))
})
.tooltip(move |cx| {
Tooltip::with_meta(
"Switch Conversations",
Some(&ToggleSavedConversations),
"UI will change, temporary.",
cx,
)
}),
) )
.child( .child(
IconButton::new("new-conversation", IconName::Plus) h_flex()
.on_click(cx.listener(move |this, _event, cx| { .gap(Spacing::Large.rems(cx))
this.new_conversation(cx); .child(
})) IconButton::new("new-conversation", IconName::Plus)
.tooltip(move |cx| Tooltip::text("New Conversation", cx)), .on_click(cx.listener(move |this, _event, cx| {
this.new_conversation(cx);
}))
.tooltip(move |cx| Tooltip::text("New Conversation", cx)),
)
.child(
IconButton::new("assistant-menu", IconName::Menu)
.disabled(true)
.tooltip(move |cx| {
Tooltip::text(
"Coming soon – Assistant settings & controls",
cx,
)
}),
),
), ),
) )
.child(list(self.list_state.clone()).flex_1())
.child(Composer::new( .child(Composer::new(
self.composer_editor.clone(), self.composer_editor.clone(),
self.project_index_button.clone(), self.project_index_button.clone(),

113
crates/assistant2/src/ui/composer.rs
View file

@ -48,68 +48,73 @@ impl RenderOnce for Composer {
fn render(mut self, cx: &mut WindowContext) -> impl IntoElement { fn render(mut self, cx: &mut WindowContext) -> impl IntoElement {
let font_size = TextSize::Default.rems(cx); let font_size = TextSize::Default.rems(cx);
let line_height = font_size.to_pixels(cx.rem_size()) * 1.3; let line_height = font_size.to_pixels(cx.rem_size()) * 1.3;
let mut editor_border = cx.theme().colors().text;
editor_border.fade_out(0.90);
// Remove the extra 1px added by the border
let padding = Spacing::XLarge.rems(cx) - rems_from_px(1.);
h_flex() h_flex()
.p(Spacing::Small.rems(cx)) .p(Spacing::Small.rems(cx))
.w_full() .w_full()
.items_start() .items_start()
.child( .child(
v_flex().size_full().gap_1().child( v_flex()
v_flex() .w_full()
.w_full() .rounded_lg()
.p_3() .p(padding)
.bg(cx.theme().colors().editor_background) .border_1()
.rounded_lg() .border_color(editor_border)
.child( .bg(cx.theme().colors().editor_background)
v_flex() .child(
.justify_between() v_flex()
.w_full() .justify_between()
.gap_2() .w_full()
.child({ .gap_2()
let settings = ThemeSettings::get_global(cx); .child({
let text_style = TextStyle { let settings = ThemeSettings::get_global(cx);
color: cx.theme().colors().editor_foreground, let text_style = TextStyle {
font_family: settings.buffer_font.family.clone(), color: cx.theme().colors().editor_foreground,
font_features: settings.buffer_font.features.clone(), font_family: settings.buffer_font.family.clone(),
font_size: font_size.into(), font_features: settings.buffer_font.features.clone(),
font_weight: FontWeight::NORMAL, font_size: font_size.into(),
font_style: FontStyle::Normal, font_weight: FontWeight::NORMAL,
line_height: line_height.into(), font_style: FontStyle::Normal,
background_color: None, line_height: line_height.into(),
underline: None, background_color: None,
strikethrough: None, underline: None,
white_space: WhiteSpace::Normal, strikethrough: None,
}; white_space: WhiteSpace::Normal,
};
EditorElement::new( EditorElement::new(
&self.editor, &self.editor,
EditorStyle { EditorStyle {
background: cx.theme().colors().editor_background, background: cx.theme().colors().editor_background,
local_player: cx.theme().players().local(), local_player: cx.theme().players().local(),
text: text_style, text: text_style,
..Default::default() ..Default::default()
}, },
)
})
.child(
h_flex()
.flex_none()
.gap_2()
.justify_between()
.w_full()
.child(
h_flex().gap_1().child(
h_flex()
.gap_2()
.child(self.render_tools(cx))
.child(Divider::vertical())
.child(self.render_attachment_tools(cx)),
),
) )
}) .child(h_flex().gap_1().child(self.model_selector)),
.child( ),
h_flex() ),
.flex_none()
.gap_2()
.justify_between()
.w_full()
.child(
h_flex().gap_1().child(
h_flex()
.gap_2()
.child(self.render_tools(cx))
.child(Divider::vertical())
.child(self.render_attachment_tools(cx)),
),
)
.child(h_flex().gap_1().child(self.model_selector)),
),
),
),
) )
} }
} }

6
crates/ui/src/styles/spacing.rs
View file

@ -27,7 +27,13 @@ pub enum Spacing {
/// ///
/// Relative to the user's `ui_font_size` and [UiDensity] setting. /// Relative to the user's `ui_font_size` and [UiDensity] setting.
Large, Large,
/// Extra Large spacing - @16px/rem: `8px`|`12px`|`16px`
///
/// Relative to the user's `ui_font_size` and [UiDensity] setting.
XLarge, XLarge,
/// 2X Large spacing - @16px/rem: `12px`|`16px`|`20px`
///
/// Relative to the user's `ui_font_size` and [UiDensity] setting.
XXLarge, XXLarge,
} }