feat: adopt the native OS theme #66
@@ -19,6 +19,7 @@ pub struct Nav {
|
|||||||
suffix: Option<AnyElement>,
|
suffix: Option<AnyElement>,
|
||||||
selected: bool,
|
selected: bool,
|
||||||
clickable: bool,
|
clickable: bool,
|
||||||
|
gap: bool,
|
||||||
#[allow(clippy::type_complexity)]
|
#[allow(clippy::type_complexity)]
|
||||||
on_click: Option<Rc<dyn Fn(&ClickEvent, &mut Window, &mut App)>>,
|
on_click: Option<Rc<dyn Fn(&ClickEvent, &mut Window, &mut App)>>,
|
||||||
}
|
}
|
||||||
@@ -38,6 +39,7 @@ impl Nav {
|
|||||||
suffix: None,
|
suffix: None,
|
||||||
selected: false,
|
selected: false,
|
||||||
clickable: false,
|
clickable: false,
|
||||||
|
gap: true,
|
||||||
on_click: None,
|
on_click: None,
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -48,6 +50,12 @@ impl Nav {
|
|||||||
self
|
self
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/// Whether to space the row's contents apart.
|
||||||
|
pub fn gap(mut self, gap: bool) -> Self {
|
||||||
|
self.gap = gap;
|
||||||
|
self
|
||||||
|
}
|
||||||
|
|
||||||
/// Sets the element shown before the label, such as an avatar or icon.
|
/// Sets the element shown before the label, such as an avatar or icon.
|
||||||
pub fn prefix(mut self, prefix: impl IntoElement) -> Self {
|
pub fn prefix(mut self, prefix: impl IntoElement) -> Self {
|
||||||
self.prefix = Some(prefix.into_any_element());
|
self.prefix = Some(prefix.into_any_element());
|
||||||
@@ -107,9 +115,17 @@ impl RenderOnce for Nav {
|
|||||||
.h_8()
|
.h_8()
|
||||||
.w_full()
|
.w_full()
|
||||||
.px_2()
|
.px_2()
|
||||||
.gap_2()
|
.when(self.gap, |this| this.gap_2())
|
||||||
.rounded(cx.theme().radius)
|
.rounded(cx.theme().radius)
|
||||||
.when_some(self.prefix, |this, prefix| this.child(prefix))
|
.when_some(self.prefix, |this, prefix| {
|
||||||
|
this.child(
|
||||||
|
h_flex()
|
||||||
|
.w_6()
|
||||||
|
.flex_shrink_0()
|
||||||
|
.justify_center()
|
||||||
|
.child(prefix),
|
||||||
|
)
|
||||||
|
})
|
||||||
.child(div().flex_1().min_w_0().truncate().child(self.label))
|
.child(div().flex_1().min_w_0().truncate().child(self.label))
|
||||||
.when_some(self.suffix, |this, suffix| {
|
.when_some(self.suffix, |this, suffix| {
|
||||||
this.child(div().flex_shrink_0().child(suffix))
|
this.child(div().flex_shrink_0().child(suffix))
|
||||||
|
|||||||
@@ -297,7 +297,7 @@ impl BrowsePanel {
|
|||||||
.px_1()
|
.px_1()
|
||||||
.rounded(cx.theme().radius)
|
.rounded(cx.theme().radius)
|
||||||
.bg(cx.theme().sidebar)
|
.bg(cx.theme().sidebar)
|
||||||
.child(Input::new(&self.input).appearance(false).small().flex_1())
|
.child(Input::new(&self.input).appearance(false).flex_1())
|
||||||
.child(
|
.child(
|
||||||
Button::new("relay-browse")
|
Button::new("relay-browse")
|
||||||
.icon(IconName::ArrowRight)
|
.icon(IconName::ArrowRight)
|
||||||
|
|||||||
@@ -7,7 +7,6 @@ use gpui::{
|
|||||||
ParentElement, SharedString, Styled, WeakEntity, div, relative, uniform_list,
|
ParentElement, SharedString, Styled, WeakEntity, div, relative, uniform_list,
|
||||||
};
|
};
|
||||||
use gpui_kit::base::StyledExt as _;
|
use gpui_kit::base::StyledExt as _;
|
||||||
use gpui_kit::component::button::{Button, ButtonVariants};
|
|
||||||
use gpui_kit::component::menu::{ContextMenuExt as _, PopupMenuItem};
|
use gpui_kit::component::menu::{ContextMenuExt as _, PopupMenuItem};
|
||||||
use gpui_kit::component::{ActiveTheme, Icon, Sizable, h_flex, v_flex};
|
use gpui_kit::component::{ActiveTheme, Icon, Sizable, h_flex, v_flex};
|
||||||
use nip29::Group;
|
use nip29::Group;
|
||||||
@@ -146,24 +145,13 @@ impl Sidebar {
|
|||||||
.gap_2()
|
.gap_2()
|
||||||
.child(
|
.child(
|
||||||
h_flex()
|
h_flex()
|
||||||
.px_2()
|
.px_4()
|
||||||
.flex_shrink_0()
|
.flex_shrink_0()
|
||||||
.justify_between()
|
.justify_between()
|
||||||
.child(
|
.child(
|
||||||
h_flex()
|
h_flex()
|
||||||
.pl_0p5()
|
|
||||||
.gap_1()
|
.gap_1()
|
||||||
.flex_shrink_1()
|
.flex_shrink_1()
|
||||||
.child(
|
|
||||||
Button::new("sidebar-back")
|
|
||||||
.icon(IconName::ArrowLeft)
|
|
||||||
.tooltip("Back")
|
|
||||||
.ghost()
|
|
||||||
.small()
|
|
||||||
.on_click(cx.listener(|this, _event, _window, cx| {
|
|
||||||
this.hide_group(cx);
|
|
||||||
})),
|
|
||||||
)
|
|
||||||
.child(Avatar::new(picture).seed(seed.clone()).small())
|
.child(Avatar::new(picture).seed(seed.clone()).small())
|
||||||
.child(
|
.child(
|
||||||
v_flex()
|
v_flex()
|
||||||
@@ -283,19 +271,19 @@ impl Sidebar {
|
|||||||
|
|
||||||
let nav = Nav::new(public_key.to_hex())
|
let nav = Nav::new(public_key.to_hex())
|
||||||
.label(person.name())
|
.label(person.name())
|
||||||
.text_xs()
|
.text_sm()
|
||||||
.font_medium()
|
|
||||||
.clickable(true)
|
.clickable(true)
|
||||||
.when(!hide_avatar, |this| {
|
.when(!hide_avatar, |this| {
|
||||||
this.prefix(
|
this.prefix(
|
||||||
Avatar::new(person.avatar())
|
Avatar::new(person.avatar())
|
||||||
.seed(person.avatar_seed())
|
.seed(person.avatar_seed())
|
||||||
.xsmall(),
|
.small(),
|
||||||
)
|
)
|
||||||
})
|
})
|
||||||
.when(!roles.is_empty(), |this| {
|
.when(!roles.is_empty(), |this| {
|
||||||
this.suffix(
|
this.suffix(
|
||||||
div()
|
div()
|
||||||
|
.font_normal()
|
||||||
.truncate()
|
.truncate()
|
||||||
.text_xs()
|
.text_xs()
|
||||||
.text_color(cx.theme().muted_foreground)
|
.text_color(cx.theme().muted_foreground)
|
||||||
|
|||||||
@@ -104,7 +104,19 @@ impl Sidebar {
|
|||||||
Box::new(Command::NewChat),
|
Box::new(Command::NewChat),
|
||||||
)
|
)
|
||||||
}),
|
}),
|
||||||
),
|
)
|
||||||
|
.when(self.group_open, |this| {
|
||||||
|
this.child(
|
||||||
|
Button::new("sidebar-back")
|
||||||
|
.icon(IconName::ArrowLeft)
|
||||||
|
.tooltip("Back")
|
||||||
|
.ghost()
|
||||||
|
.small()
|
||||||
|
.on_click(cx.listener(|this, _event, _window, cx| {
|
||||||
|
this.hide_group(cx);
|
||||||
|
})),
|
||||||
|
)
|
||||||
|
}),
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -84,7 +84,6 @@ impl Sidebar {
|
|||||||
this.suffix(
|
this.suffix(
|
||||||
h_flex()
|
h_flex()
|
||||||
.gap_1()
|
.gap_1()
|
||||||
.items_center()
|
|
||||||
.child(
|
.child(
|
||||||
h_flex()
|
h_flex()
|
||||||
.py_0p5()
|
.py_0p5()
|
||||||
@@ -120,6 +119,7 @@ impl Sidebar {
|
|||||||
Nav::new("contacts")
|
Nav::new("contacts")
|
||||||
.prefix(Icon::new(IconName::Book).small())
|
.prefix(Icon::new(IconName::Book).small())
|
||||||
.label("Contacts")
|
.label("Contacts")
|
||||||
|
.gap(false)
|
||||||
.text_sm()
|
.text_sm()
|
||||||
.when(contacts_open, |this| this.bg(cx.theme().list_active))
|
.when(contacts_open, |this| this.bg(cx.theme().list_active))
|
||||||
.on_click(cx.listener(|this, _event, window, cx| {
|
.on_click(cx.listener(|this, _event, window, cx| {
|
||||||
|
|||||||
@@ -2,7 +2,7 @@ use std::time::{SystemTime, UNIX_EPOCH};
|
|||||||
|
|
||||||
use gpui::{AnyElement, App, IntoElement, ParentElement, SharedString, Styled, Window, img};
|
use gpui::{AnyElement, App, IntoElement, ParentElement, SharedString, Styled, Window, img};
|
||||||
use gpui_kit::component::button::{Button, ButtonVariants};
|
use gpui_kit::component::button::{Button, ButtonVariants};
|
||||||
use gpui_kit::component::{Sizable, v_flex};
|
use gpui_kit::component::v_flex;
|
||||||
|
|
||||||
use crate::dialogs::import;
|
use crate::dialogs::import;
|
||||||
|
|
||||||
@@ -32,7 +32,6 @@ pub(super) fn render_signed_out(_window: &mut Window, _cx: &mut App) -> AnyEleme
|
|||||||
Button::new("import")
|
Button::new("import")
|
||||||
.label("Import Identity")
|
.label("Import Identity")
|
||||||
.primary()
|
.primary()
|
||||||
.large()
|
|
||||||
.on_click(|_, window, cx| {
|
.on_click(|_, window, cx| {
|
||||||
import::open(window, cx);
|
import::open(window, cx);
|
||||||
}),
|
}),
|
||||||
|
|||||||
@@ -205,6 +205,7 @@ impl Sidebar {
|
|||||||
|
|
||||||
pub(super) fn render_find(&self, cx: &mut Context<Self>) -> AnyElement {
|
pub(super) fn render_find(&self, cx: &mut Context<Self>) -> AnyElement {
|
||||||
h_flex()
|
h_flex()
|
||||||
|
.mb_2()
|
||||||
.px_2()
|
.px_2()
|
||||||
.flex_shrink_0()
|
.flex_shrink_0()
|
||||||
.w_full()
|
.w_full()
|
||||||
@@ -214,8 +215,8 @@ impl Sidebar {
|
|||||||
.gap_1()
|
.gap_1()
|
||||||
.w_full()
|
.w_full()
|
||||||
.rounded(cx.theme().radius)
|
.rounded(cx.theme().radius)
|
||||||
.bg(cx.theme().secondary)
|
.bg(cx.theme().input_background())
|
||||||
.child(Input::new(&self.find_input).appearance(false).small())
|
.child(Input::new(&self.find_input).appearance(false))
|
||||||
.child(
|
.child(
|
||||||
Button::new("sidebar-global")
|
Button::new("sidebar-global")
|
||||||
.icon(IconName::Compass)
|
.icon(IconName::Compass)
|
||||||
@@ -224,7 +225,7 @@ impl Sidebar {
|
|||||||
} else {
|
} else {
|
||||||
"Enable global search"
|
"Enable global search"
|
||||||
})
|
})
|
||||||
.small()
|
.xsmall()
|
||||||
.ghost()
|
.ghost()
|
||||||
.selected(self.global_open)
|
.selected(self.global_open)
|
||||||
.loading(self.global_finding)
|
.loading(self.global_finding)
|
||||||
|
|||||||
Reference in New Issue
Block a user