list: Fix incorrect selected item background color (#1648)
It will mix `accent` and `list_active` before.
This commit is contained in:
parent
b6dace13cc
commit
d55125149b
2 changed files with 11 additions and 28 deletions
|
|
@ -4,7 +4,7 @@ use fake::Fake;
|
||||||
use gpui::{
|
use gpui::{
|
||||||
App, AppContext, Context, ElementId, Entity, FocusHandle, Focusable, InteractiveElement,
|
App, AppContext, Context, ElementId, Entity, FocusHandle, Focusable, InteractiveElement,
|
||||||
IntoElement, ParentElement, Render, RenderOnce, ScrollStrategy, SharedString, Styled,
|
IntoElement, ParentElement, Render, RenderOnce, ScrollStrategy, SharedString, Styled,
|
||||||
Subscription, Task, Timer, Window, actions, div, prelude::FluentBuilder as _, px,
|
Subscription, Task, Timer, Window, actions, div, px,
|
||||||
};
|
};
|
||||||
|
|
||||||
use gpui_component::{
|
use gpui_component::{
|
||||||
|
|
@ -46,22 +46,15 @@ impl Company {
|
||||||
#[derive(IntoElement)]
|
#[derive(IntoElement)]
|
||||||
struct CompanyListItem {
|
struct CompanyListItem {
|
||||||
base: ListItem,
|
base: ListItem,
|
||||||
ix: IndexPath,
|
|
||||||
company: Rc<Company>,
|
company: Rc<Company>,
|
||||||
selected: bool,
|
selected: bool,
|
||||||
}
|
}
|
||||||
|
|
||||||
impl CompanyListItem {
|
impl CompanyListItem {
|
||||||
pub fn new(
|
pub fn new(id: impl Into<ElementId>, company: Rc<Company>, selected: bool) -> Self {
|
||||||
id: impl Into<ElementId>,
|
|
||||||
company: Rc<Company>,
|
|
||||||
ix: IndexPath,
|
|
||||||
selected: bool,
|
|
||||||
) -> Self {
|
|
||||||
CompanyListItem {
|
CompanyListItem {
|
||||||
company,
|
company,
|
||||||
ix,
|
base: ListItem::new(id).selected(selected),
|
||||||
base: ListItem::new(id),
|
|
||||||
selected,
|
selected,
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
@ -92,24 +85,11 @@ impl RenderOnce for CompanyListItem {
|
||||||
_ => cx.theme().foreground,
|
_ => cx.theme().foreground,
|
||||||
};
|
};
|
||||||
|
|
||||||
let bg_color = if self.selected {
|
|
||||||
cx.theme().list_active
|
|
||||||
} else if self.ix.row % 2 == 0 {
|
|
||||||
cx.theme().list
|
|
||||||
} else {
|
|
||||||
cx.theme().list_even
|
|
||||||
};
|
|
||||||
|
|
||||||
self.base
|
self.base
|
||||||
.px_2()
|
.px_2()
|
||||||
.py_1()
|
.py_1()
|
||||||
.overflow_x_hidden()
|
.overflow_x_hidden()
|
||||||
.bg(bg_color)
|
|
||||||
.border_1()
|
.border_1()
|
||||||
.border_color(bg_color)
|
|
||||||
.when(self.selected, |this| {
|
|
||||||
this.border_color(cx.theme().list_active_border)
|
|
||||||
})
|
|
||||||
.rounded(cx.theme().radius)
|
.rounded(cx.theme().radius)
|
||||||
.child(
|
.child(
|
||||||
h_flex()
|
h_flex()
|
||||||
|
|
@ -293,7 +273,7 @@ impl ListDelegate for CompanyListDelegate {
|
||||||
fn render_item(&self, ix: IndexPath, _: &mut Window, _: &mut App) -> Option<Self::Item> {
|
fn render_item(&self, ix: IndexPath, _: &mut Window, _: &mut App) -> Option<Self::Item> {
|
||||||
let selected = Some(ix) == self.selected_index || Some(ix) == self.confirmed_index;
|
let selected = Some(ix) == self.selected_index || Some(ix) == self.confirmed_index;
|
||||||
if let Some(company) = self.matched_companies[ix.section].get(ix.row) {
|
if let Some(company) = self.matched_companies[ix.section].get(ix.row) {
|
||||||
return Some(CompanyListItem::new(ix, company.clone(), ix, selected));
|
return Some(CompanyListItem::new(ix, company.clone(), selected));
|
||||||
}
|
}
|
||||||
|
|
||||||
None
|
None
|
||||||
|
|
|
||||||
|
|
@ -203,16 +203,19 @@ impl RenderOnce for ListItem {
|
||||||
.when_some(self.suffix, |this, suffix| this.child(suffix(window, cx)))
|
.when_some(self.suffix, |this, suffix| this.child(suffix(window, cx)))
|
||||||
.map(|this| {
|
.map(|this| {
|
||||||
if is_selectable && (self.selected || self.secondary_selected) {
|
if is_selectable && (self.selected || self.secondary_selected) {
|
||||||
this.bg(cx.theme().accent).child(
|
let bg = if self.selected {
|
||||||
|
cx.theme().list_active
|
||||||
|
} else {
|
||||||
|
cx.theme().accent
|
||||||
|
};
|
||||||
|
|
||||||
|
this.bg(bg).child(
|
||||||
div()
|
div()
|
||||||
.absolute()
|
.absolute()
|
||||||
.top_0()
|
.top_0()
|
||||||
.left_0()
|
.left_0()
|
||||||
.right_0()
|
.right_0()
|
||||||
.bottom_0()
|
.bottom_0()
|
||||||
.when(!self.secondary_selected, |this| {
|
|
||||||
this.bg(cx.theme().list_active)
|
|
||||||
})
|
|
||||||
.border_1()
|
.border_1()
|
||||||
.border_color(cx.theme().list_active_border)
|
.border_color(cx.theme().list_active_border)
|
||||||
.refine_style(&selected_style),
|
.refine_style(&selected_style),
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue