dan/gpui-component
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

accordion: Improve Accordion style, and remove item gap when no border. (#1004)

Browse source 
<img width="635" alt="image"
src="https://github.com/user-attachments/assets/a18aaa73-9cca-4adb-bee9-8cac2178bda0"
/>
<img width="650" alt="image"
src="https://github.com/user-attachments/assets/02b10d8c-47a3-4226-9585-d1d970679dde"
/>
This commit is contained in:
Jason Lee 2025-06-24 17:46:55 +08:00 committed by GitHub
parent 21c8844377
commit c05d63dfbe
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 9 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
crates/ui/src/accordion.rs
View file

@ -1,9 +1,9 @@
use std::{cell::RefCell, collections::HashSet, rc::Rc, sync::Arc}; use std::{cell::RefCell, collections::HashSet, rc::Rc, sync::Arc};
use gpui::{ use gpui::{
div, prelude::FluentBuilder as _, rems, AnyElement, App, Div, ElementId, div, prelude::FluentBuilder as _, rems, AnyElement, App, ElementId, InteractiveElement as _,
InteractiveElement as _, IntoElement, ParentElement, RenderOnce, SharedString, IntoElement, ParentElement, RenderOnce, SharedString, StatefulInteractiveElement as _, Styled,
StatefulInteractiveElement as _, Styled, Window, Window,
}; };
use crate::{h_flex, v_flex, ActiveTheme as _, Icon, IconName, Sizable, Size}; use crate::{h_flex, v_flex, ActiveTheme as _, Icon, IconName, Sizable, Size};
@ -12,7 +12,6 @@ use crate::{h_flex, v_flex, ActiveTheme as _, Icon, IconName, Sizable, Size};
#[derive(IntoElement)] #[derive(IntoElement)]
pub struct Accordion { pub struct Accordion {
id: ElementId, id: ElementId,
base: Div,
multiple: bool, multiple: bool,
size: Size, size: Size,
bordered: bool, bordered: bool,
@ -25,7 +24,6 @@ impl Accordion {
pub fn new(id: impl Into<ElementId>) -> Self { pub fn new(id: impl Into<ElementId>) -> Self {
Self { Self {
id: id.into(), id: id.into(),
base: v_flex().gap_1(),
multiple: false, multiple: false,
size: Size::default(), size: Size::default(),
bordered: true, bordered: true,
@ -83,8 +81,9 @@ impl RenderOnce for Accordion {
let open_ixs = Rc::new(RefCell::new(HashSet::new())); let open_ixs = Rc::new(RefCell::new(HashSet::new()));
let is_multiple = self.multiple; let is_multiple = self.multiple;
self.base v_flex()
.id(self.id) .id(self.id)
.when(self.bordered, |this| this.gap_1())
.children( .children(
self.children self.children
.into_iter() .into_iter()
@ -241,14 +240,15 @@ impl RenderOnce for AccordionItem {
}) })
.when(self.open, |this| { .when(self.open, |this| {
this.when(self.bordered, |this| { this.when(self.bordered, |this| {
this.bg(cx.theme().accordion_active) this.text_color(cx.theme().foreground)
.text_color(cx.theme().foreground)
.border_b_1() .border_b_1()
.border_color(cx.theme().border) .border_color(cx.theme().border)
}) })
}) })
.when(!self.bordered, |this| { .when(!self.bordered, |this| {
this.border_b_1().border_color(cx.theme().border) this.border_b_1()
.border_color(cx.theme().border)
.rounded_t(cx.theme().radius)
}) })
.child( .child(
h_flex() h_flex()