feat: improve message list

This commit is contained in:
2025-01-22 09:04:31 +07:00
parent 582db29209
commit 0d445dfca1
9 changed files with 134 additions and 76 deletions

View File

@@ -497,6 +497,7 @@ impl ButtonVariant {
_ => cx.theme().accent.step(cx, ColorScaleStep::ONE),
},
ButtonVariant::Link => cx.theme().accent.step(cx, ColorScaleStep::NINE),
ButtonVariant::Ghost => cx.theme().base.step(cx, ColorScaleStep::ELEVEN),
ButtonVariant::Custom(colors) => colors.foreground,
_ => cx.theme().base.step(cx, ColorScaleStep::TWELVE),
}
@@ -543,13 +544,14 @@ impl ButtonVariant {
fn hovered(&self, cx: &WindowContext) -> ButtonVariantStyle {
let bg = match self {
ButtonVariant::Primary => cx.theme().accent.step(cx, ColorScaleStep::TEN),
ButtonVariant::Ghost => cx.theme().base.step(cx, ColorScaleStep::THREE),
ButtonVariant::Ghost => cx.theme().base.step(cx, ColorScaleStep::FOUR),
ButtonVariant::Link => cx.theme().transparent,
ButtonVariant::Text => cx.theme().transparent,
ButtonVariant::Custom(colors) => colors.hover,
};
let border = self.border_color(cx);
let fg = match self {
ButtonVariant::Ghost => cx.theme().base.step(cx, ColorScaleStep::TWELVE),
ButtonVariant::Link => cx.theme().accent.step(cx, ColorScaleStep::TEN),
_ => self.text_color(cx),
};

View File

@@ -65,7 +65,7 @@ impl RenderOnce for Divider {
})
.bg(self
.color
.unwrap_or(cx.theme().base.step(cx, ColorScaleStep::THREE))),
.unwrap_or(cx.theme().base.step(cx, ColorScaleStep::FIVE))),
)
.when_some(self.label, |this, label| {
this.child(

View File

@@ -274,7 +274,7 @@ impl Dock {
})
.child(
div()
.bg(cx.theme().base.step(cx, ColorScaleStep::THREE))
.bg(cx.theme().base.step(cx, ColorScaleStep::FIVE))
.when(axis.is_horizontal(), |this| this.h_full().w(HANDLE_SIZE))
.when(axis.is_vertical(), |this| this.w_full().h(HANDLE_SIZE)),
)

View File

@@ -1389,16 +1389,12 @@ impl Render for TextInput {
.cursor_text()
.when(self.multi_line, |this| this.h_auto())
.when(self.appearance, |this| {
this.bg(if self.disabled {
cx.theme().transparent
} else {
cx.theme().base.step(cx, ColorScaleStep::THREE)
})
.rounded(px(cx.theme().radius))
.when(cx.theme().shadow, |this| this.shadow_sm())
.when(focused, |this| this.outline(cx))
.when(prefix.is_none(), |this| this.input_pl(self.size))
.when(suffix.is_none(), |this| this.input_pr(self.size))
this.bg(cx.theme().base.step(cx, ColorScaleStep::THREE))
.rounded(px(cx.theme().radius))
.when(cx.theme().shadow, |this| this.shadow_sm())
.when(focused, |this| this.outline(cx))
.when(prefix.is_none(), |this| this.input_pl(self.size))
.when(suffix.is_none(), |this| this.input_pr(self.size))
})
.children(prefix)
.gap_1()

View File

@@ -200,8 +200,11 @@ impl Notification {
.detach()
}
}
impl EventEmitter<DismissEvent> for Notification {}
impl FluentBuilder for Notification {}
impl Render for Notification {
fn render(&mut self, cx: &mut ViewContext<Self>) -> impl IntoElement {
let closing = self.closing;
@@ -209,15 +212,15 @@ impl Render for Notification {
Some(icon) => icon,
None => match self.type_ {
NotificationType::Info => {
Icon::new(IconName::Info).text_color(blue().step(cx, ColorScaleStep::FIVE))
Icon::new(IconName::Info).text_color(blue().step(cx, ColorScaleStep::NINE))
}
NotificationType::Error => {
Icon::new(IconName::CircleX).text_color(red().step(cx, ColorScaleStep::FIVE))
Icon::new(IconName::CircleX).text_color(red().step(cx, ColorScaleStep::NINE))
}
NotificationType::Success => Icon::new(IconName::CircleCheck)
.text_color(green().step(cx, ColorScaleStep::FIVE)),
.text_color(green().step(cx, ColorScaleStep::NINE)),
NotificationType::Warning => Icon::new(IconName::TriangleAlert)
.text_color(yellow().step(cx, ColorScaleStep::FIVE)),
.text_color(yellow().step(cx, ColorScaleStep::NINE)),
},
};
@@ -226,16 +229,15 @@ impl Render for Notification {
.group("")
.occlude()
.relative()
.w_96()
.w_72()
.border_1()
.border_color(cx.theme().base.step(cx, ColorScaleStep::FIVE))
.bg(cx.theme().background)
.rounded_md()
.rounded(px(cx.theme().radius))
.shadow_md()
.py_2()
.px_4()
.p_2()
.gap_3()
.child(div().absolute().top_3().left_4().child(icon))
.child(div().absolute().top_3().left_2().child(icon))
.child(
v_flex()
.pl_6()