introduce typography system and motion module
This commit is contained in:
+37
-32
@@ -24,7 +24,7 @@ use smallvec::{SmallVec, smallvec};
|
||||
use state::{
|
||||
FileAttachment, NostrRegistry, download_and_decrypt_to_file, upload, upload_encrypted,
|
||||
};
|
||||
use theme::ActiveTheme;
|
||||
use theme::{ActiveTheme, TextStyle, Typeset as _};
|
||||
use ui::avatar::Avatar;
|
||||
use ui::button::{Button, ButtonVariants};
|
||||
use ui::dock::{Panel, PanelEvent};
|
||||
@@ -903,7 +903,7 @@ impl ChatPanel {
|
||||
h_flex()
|
||||
.h_10()
|
||||
.justify_center()
|
||||
.text_sm()
|
||||
.text_style(TextStyle::Callout)
|
||||
.bg(cx.theme().surface_raised)
|
||||
.rounded(px(theme::panel_radius()))
|
||||
.child("Message isn't traced yet"),
|
||||
@@ -918,10 +918,10 @@ impl ChatPanel {
|
||||
h_flex()
|
||||
.h_7()
|
||||
.px_2()
|
||||
.gap_2()
|
||||
.gap(px(theme::SPACE))
|
||||
.bg(cx.theme().surface_raised)
|
||||
.rounded(px(theme::control_radius()))
|
||||
.text_sm()
|
||||
.text_style(TextStyle::Callout)
|
||||
.child(div().size_1p5().rounded_full().bg(gpui::green()))
|
||||
.child(SharedString::from(url.to_string())),
|
||||
);
|
||||
@@ -950,10 +950,10 @@ impl ChatPanel {
|
||||
h_flex()
|
||||
.h_7()
|
||||
.px_2()
|
||||
.gap_2()
|
||||
.gap(px(theme::SPACE))
|
||||
.bg(cx.theme().surface_raised)
|
||||
.rounded(px(theme::control_radius()))
|
||||
.text_sm()
|
||||
.text_style(TextStyle::Callout)
|
||||
.child(div().size_1p5().rounded_full().bg(gpui::green()))
|
||||
.child(SharedString::from(url.to_string())),
|
||||
);
|
||||
@@ -990,7 +990,7 @@ impl ChatPanel {
|
||||
.items_center()
|
||||
.justify_center()
|
||||
.text_center()
|
||||
.text_xs()
|
||||
.text_style(TextStyle::Caption)
|
||||
.text_color(cx.theme().text_faint)
|
||||
.line_height(relative(1.3))
|
||||
.child(
|
||||
@@ -1013,7 +1013,7 @@ impl ChatPanel {
|
||||
h_flex()
|
||||
.w_full()
|
||||
.gap_3()
|
||||
.text_sm()
|
||||
.text_style(TextStyle::Callout)
|
||||
.child(
|
||||
h_flex()
|
||||
.flex_shrink_0()
|
||||
@@ -1201,7 +1201,7 @@ impl ChatPanel {
|
||||
.flex()
|
||||
.flex_row()
|
||||
.flex_wrap()
|
||||
.gap_2()
|
||||
.gap(px(theme::SPACE))
|
||||
.children({
|
||||
let mut items = vec![];
|
||||
|
||||
@@ -1245,7 +1245,7 @@ impl ChatPanel {
|
||||
.px_2()
|
||||
.border_l_2()
|
||||
.border_color(cx.theme().element_active)
|
||||
.text_sm()
|
||||
.text_style(TextStyle::Callout)
|
||||
.child(div().font_semibold().child(author.name()))
|
||||
.child(
|
||||
div()
|
||||
@@ -1287,11 +1287,11 @@ impl ChatPanel {
|
||||
.unwrap_or(false);
|
||||
|
||||
h_flex()
|
||||
.gap_2()
|
||||
.gap(px(theme::SPACE))
|
||||
.py_0p5()
|
||||
.px_1()
|
||||
.rounded(px(theme::control_radius()))
|
||||
.text_xs()
|
||||
.text_style(TextStyle::Caption)
|
||||
.border_1()
|
||||
.when(has_reacted, |this| {
|
||||
this.text_color(cx.theme().text)
|
||||
@@ -1361,12 +1361,12 @@ impl ChatPanel {
|
||||
let avatar = profile.avatar();
|
||||
|
||||
v_flex()
|
||||
.gap_2()
|
||||
.gap(px(theme::SPACE))
|
||||
.w_full()
|
||||
.child(
|
||||
h_flex()
|
||||
.gap_2()
|
||||
.text_sm()
|
||||
.gap(px(theme::SPACE))
|
||||
.text_style(TextStyle::Callout)
|
||||
.child(SharedString::from("Sent to:"))
|
||||
.child(
|
||||
h_flex()
|
||||
@@ -1384,7 +1384,7 @@ impl ChatPanel {
|
||||
.p_1()
|
||||
.h_16()
|
||||
.w_full()
|
||||
.text_sm()
|
||||
.text_style(TextStyle::Callout)
|
||||
.rounded(px(theme::surface_radius()))
|
||||
.bg(cx.theme().warning_muted)
|
||||
.text_color(cx.theme().warning)
|
||||
@@ -1394,7 +1394,7 @@ impl ChatPanel {
|
||||
.when_some(report.output().cloned(), |this, output| {
|
||||
this.child(
|
||||
v_flex()
|
||||
.gap_2()
|
||||
.gap(px(theme::SPACE))
|
||||
.w_full()
|
||||
.children({
|
||||
let mut items = Vec::with_capacity(output.failed.len());
|
||||
@@ -1409,14 +1409,14 @@ impl ChatPanel {
|
||||
.bg(cx.theme().danger.opacity(0.06))
|
||||
.child(
|
||||
div()
|
||||
.text_xs()
|
||||
.text_style(TextStyle::Caption)
|
||||
.font_semibold()
|
||||
.line_height(relative(1.25))
|
||||
.child(SharedString::from(url.to_string())),
|
||||
)
|
||||
.child(
|
||||
div()
|
||||
.text_xs()
|
||||
.text_style(TextStyle::Caption)
|
||||
.text_color(cx.theme().danger_muted.opacity(0.9))
|
||||
.line_height(relative(1.25))
|
||||
.child(SharedString::from(msg.to_string())),
|
||||
@@ -1439,14 +1439,14 @@ impl ChatPanel {
|
||||
.bg(cx.theme().surface_card)
|
||||
.child(
|
||||
div()
|
||||
.text_xs()
|
||||
.text_style(TextStyle::Caption)
|
||||
.font_semibold()
|
||||
.line_height(relative(1.25))
|
||||
.child(SharedString::from(url.0.to_string())),
|
||||
)
|
||||
.child(
|
||||
div()
|
||||
.text_xs()
|
||||
.text_style(TextStyle::Caption)
|
||||
.line_height(relative(1.25))
|
||||
.child(SharedString::from("Successfully")),
|
||||
),
|
||||
@@ -1642,7 +1642,7 @@ impl ChatPanel {
|
||||
.self_start()
|
||||
.items_start()
|
||||
.min_w_0()
|
||||
.gap_2()
|
||||
.gap(px(theme::SPACE))
|
||||
.p_2()
|
||||
.border_1()
|
||||
.border_color(cx.theme().border_faint)
|
||||
@@ -1652,11 +1652,11 @@ impl ChatPanel {
|
||||
v_flex()
|
||||
.min_w_0()
|
||||
.overflow_hidden()
|
||||
.text_sm()
|
||||
.text_style(TextStyle::Callout)
|
||||
.child(div().line_height(relative(1.2)).child(file.display_name()))
|
||||
.child(
|
||||
div()
|
||||
.text_xs()
|
||||
.text_style(TextStyle::Caption)
|
||||
.text_color(cx.theme().text_faint)
|
||||
.child(label),
|
||||
),
|
||||
@@ -1702,7 +1702,7 @@ impl ChatPanel {
|
||||
.border_1()
|
||||
.border_color(cx.theme().border_faint)
|
||||
.bg(cx.theme().surface)
|
||||
.text_xs()
|
||||
.text_style(TextStyle::Caption)
|
||||
.text_center()
|
||||
.child("Preview not available"),
|
||||
)
|
||||
@@ -1764,7 +1764,7 @@ impl ChatPanel {
|
||||
.flex()
|
||||
.items_baseline()
|
||||
.gap_1()
|
||||
.text_xs()
|
||||
.text_style(TextStyle::Caption)
|
||||
.text_color(cx.theme().text_muted)
|
||||
.child("Replying to:")
|
||||
.child(div().text_color(cx.theme().accent).child(profile.name())),
|
||||
@@ -1785,7 +1785,7 @@ impl ChatPanel {
|
||||
.child(
|
||||
div()
|
||||
.w_full()
|
||||
.text_sm()
|
||||
.text_style(TextStyle::Callout)
|
||||
.text_ellipsis()
|
||||
.line_clamp(1)
|
||||
.child(text.preview()),
|
||||
@@ -1881,12 +1881,17 @@ impl Panel for ChatPanel {
|
||||
|
||||
h_flex()
|
||||
.gap_1()
|
||||
.text_xs()
|
||||
.text_style(TextStyle::Caption)
|
||||
.child(Avatar::new(picture).seed(seed).xsmall())
|
||||
.child(label)
|
||||
.into_any_element()
|
||||
})
|
||||
.unwrap_or(div().text_xs().child("Unknown").into_any_element())
|
||||
.unwrap_or(
|
||||
div()
|
||||
.text_style(TextStyle::Caption)
|
||||
.child("Unknown")
|
||||
.into_any_element(),
|
||||
)
|
||||
}
|
||||
|
||||
fn toolbar_buttons(&self, _window: &Window, _cx: &App) -> Vec<Button> {
|
||||
@@ -1933,10 +1938,10 @@ impl Render for ChatPanel {
|
||||
.h_12()
|
||||
.w_full()
|
||||
.px_2()
|
||||
.gap_2()
|
||||
.gap(px(theme::SPACE))
|
||||
.border_b_1()
|
||||
.border_color(cx.theme().border)
|
||||
.child(Input::new(&self.subject_input).text_sm().small())
|
||||
.child(Input::new(&self.subject_input).small())
|
||||
.child(
|
||||
Button::new("change")
|
||||
.icon(IconName::CheckCircle)
|
||||
@@ -1989,7 +1994,7 @@ impl Render for ChatPanel {
|
||||
this.child(
|
||||
div()
|
||||
.px_1()
|
||||
.text_xs()
|
||||
.text_style(TextStyle::Caption)
|
||||
.text_color(cx.theme().warning)
|
||||
.child(WARNING),
|
||||
)
|
||||
|
||||
Reference in New Issue
Block a user