Fix ListItem check icon.
This commit is contained in:
parent
cb8067d89b
commit
daf4e713d1
4 changed files with 33 additions and 22 deletions
|
|
@ -10,6 +10,7 @@ use crate::{
|
|||
selectable::{Selectable, Selection},
|
||||
stock::{h_flex, v_flex},
|
||||
theme::{ActiveTheme, Colorize as _},
|
||||
IconName,
|
||||
};
|
||||
|
||||
type OnClick = Box<dyn Fn(&Selection, &mut WindowContext) + 'static>;
|
||||
|
|
@ -114,8 +115,8 @@ impl RenderOnce for Checkbox {
|
|||
.size_3()
|
||||
.text_color(icon_color)
|
||||
.map(|this| match self.checked {
|
||||
Selection::Selected => this.path("icons/check.svg"),
|
||||
Selection::Indeterminate => this.path("icons/minus.svg"),
|
||||
Selection::Selected => this.path(IconName::Check.path()),
|
||||
Selection::Indeterminate => this.path(IconName::Minus.path()),
|
||||
_ => this,
|
||||
}),
|
||||
),
|
||||
|
|
|
|||
|
|
@ -184,10 +184,11 @@ where
|
|||
}))
|
||||
.child(
|
||||
h_flex()
|
||||
.w_full()
|
||||
.items_center()
|
||||
.justify_between()
|
||||
.child(title)
|
||||
.child(IconName::ChevronDown),
|
||||
.child(div().flex_1().child(title))
|
||||
.child(div().w_4().h_4().child(IconName::ChevronDown)),
|
||||
),
|
||||
)
|
||||
.when(self.open, |this| {
|
||||
|
|
|
|||
|
|
@ -1,4 +1,6 @@
|
|||
use gpui::{svg, IntoElement, RenderOnce, SharedString, Styled as _, Svg, WindowContext};
|
||||
use gpui::{svg, IntoElement, RenderOnce, SharedString, Styled, Svg, WindowContext};
|
||||
|
||||
use crate::theme::ActiveTheme;
|
||||
|
||||
#[derive(IntoElement)]
|
||||
pub enum IconName {
|
||||
|
|
@ -38,10 +40,16 @@ pub struct Icon {
|
|||
path: SharedString,
|
||||
}
|
||||
|
||||
impl Styled for Icon {
|
||||
fn style(&mut self) -> &mut gpui::StyleRefinement {
|
||||
self.base.style()
|
||||
}
|
||||
}
|
||||
|
||||
impl Icon {
|
||||
pub fn new(name: IconName) -> Self {
|
||||
Self {
|
||||
base: svg().flex_none().size_full(),
|
||||
base: svg().flex_none().size_4(),
|
||||
path: name.path(),
|
||||
}
|
||||
}
|
||||
|
|
@ -56,7 +64,7 @@ impl Icon {
|
|||
}
|
||||
|
||||
impl RenderOnce for Icon {
|
||||
fn render(self, _cx: &mut WindowContext) -> impl IntoElement {
|
||||
self.base.path(self.path)
|
||||
fn render(self, cx: &mut WindowContext) -> impl IntoElement {
|
||||
self.base.text_color(cx.theme().foreground).path(self.path)
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
use gpui::{
|
||||
div, prelude::FluentBuilder as _, ClickEvent, Div, ElementId, InteractiveElement, IntoElement,
|
||||
MouseButton, MouseDownEvent, ParentElement, RenderOnce, SharedString, Stateful,
|
||||
div, prelude::FluentBuilder as _, AnyElement, ClickEvent, Div, ElementId, InteractiveElement,
|
||||
IntoElement, MouseButton, MouseDownEvent, ParentElement, RenderOnce, SharedString, Stateful,
|
||||
StatefulInteractiveElement as _, Style, Styled, WindowContext,
|
||||
};
|
||||
|
||||
|
|
@ -11,7 +11,7 @@ pub struct ListItem {
|
|||
base: Stateful<Div>,
|
||||
disabled: bool,
|
||||
selected: bool,
|
||||
check_icon: Option<IconName>,
|
||||
check_icon: Option<Icon>,
|
||||
on_click: Option<Box<dyn Fn(&ClickEvent, &mut WindowContext) + 'static>>,
|
||||
on_secondary_mouse_down: Option<Box<dyn Fn(&MouseDownEvent, &mut WindowContext) + 'static>>,
|
||||
}
|
||||
|
|
@ -29,7 +29,7 @@ impl ListItem {
|
|||
}
|
||||
|
||||
pub fn check_icon(mut self, icon: IconName) -> Self {
|
||||
self.check_icon = Some(icon);
|
||||
self.check_icon = Some(Icon::new(icon));
|
||||
self
|
||||
}
|
||||
|
||||
|
|
@ -87,9 +87,7 @@ impl RenderOnce for ListItem {
|
|||
fn render(self, cx: &mut WindowContext) -> impl IntoElement {
|
||||
h_flex()
|
||||
.id("item-group")
|
||||
.items_center()
|
||||
.gap_2()
|
||||
.w_full()
|
||||
.flex_none()
|
||||
.relative()
|
||||
.gap_x_2()
|
||||
.text_base()
|
||||
|
|
@ -105,12 +103,15 @@ impl RenderOnce for ListItem {
|
|||
this.hover(|this| this.bg(cx.theme().accent))
|
||||
})
|
||||
.when(self.selected, |this| this.bg(cx.theme().accent))
|
||||
.child(self.base.when(self.selected, |this| {
|
||||
if let Some(icon) = self.check_icon {
|
||||
this.child(icon)
|
||||
} else {
|
||||
this
|
||||
}
|
||||
}))
|
||||
.child(self.base.w_full().items_center().justify_between().when(
|
||||
self.selected,
|
||||
|this| {
|
||||
if let Some(icon) = self.check_icon {
|
||||
this.child(icon.text_color(cx.theme().muted))
|
||||
} else {
|
||||
this
|
||||
}
|
||||
},
|
||||
))
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in a new issue