Add terminal colors to ThemeColors, add _background to some color names.

This commit is contained in:
Nate Butler 2023-11-02 19:53:52 -04:00
parent 95a0827517
commit 2b0c959137
28 changed files with 224 additions and 106 deletions

View file

@ -220,7 +220,7 @@ impl Buffer {
.flex_1()
.w_full()
.h_full()
.bg(cx.theme().colors().editor)
.bg(cx.theme().colors().editor_background)
.children(rows)
}
}

View file

@ -30,14 +30,17 @@ impl Render for BufferSearch {
type Element = Div<Self>;
fn render(&mut self, cx: &mut ViewContext<Self>) -> Div<Self> {
h_stack().bg(cx.theme().colors().toolbar).p_2().child(
h_stack().child(Input::new("Search")).child(
IconButton::<Self>::new("replace", Icon::Replace)
.when(self.is_replace_open, |this| this.color(IconColor::Accent))
.on_click(|buffer_search, cx| {
buffer_search.toggle_replace(cx);
}),
),
)
h_stack()
.bg(cx.theme().colors().toolbar_background)
.p_2()
.child(
h_stack().child(Input::new("Search")).child(
IconButton::<Self>::new("replace", Icon::Replace)
.when(self.is_replace_open, |this| this.color(IconColor::Accent))
.on_click(|buffer_search, cx| {
buffer_search.toggle_replace(cx);
}),
),
)
}
}

View file

@ -18,7 +18,7 @@ impl CollabPanel {
v_stack()
.id(self.id.clone())
.h_full()
.bg(cx.theme().colors().surface)
.bg(cx.theme().colors().surface_background)
.child(
v_stack()
.id("crdb")

View file

@ -46,7 +46,7 @@ impl ContextMenu {
fn render<V: 'static>(self, _view: &mut V, cx: &mut ViewContext<V>) -> impl Component<V> {
v_stack()
.flex()
.bg(cx.theme().colors().elevated_surface)
.bg(cx.theme().colors().elevated_surface_background)
.border()
.border_color(cx.theme().colors().border)
.child(

View file

@ -73,12 +73,12 @@ impl<V: 'static> IconButton<V> {
let (bg_color, bg_hover_color, bg_active_color) = match self.variant {
ButtonVariant::Filled => (
cx.theme().colors().element,
cx.theme().colors().element_background,
cx.theme().colors().element_hover,
cx.theme().colors().element_active,
),
ButtonVariant::Ghost => (
cx.theme().colors().ghost_element,
cx.theme().colors().ghost_element_background,
cx.theme().colors().ghost_element_hover,
cx.theme().colors().ghost_element_active,
),

View file

@ -66,7 +66,7 @@ impl Key {
.rounded_md()
.text_sm()
.text_color(cx.theme().colors().text)
.bg(cx.theme().colors().element)
.bg(cx.theme().colors().element_background)
.child(self.key.clone())
}
}

View file

@ -106,7 +106,7 @@ impl ListHeader {
h_stack()
.w_full()
.bg(cx.theme().colors().surface)
.bg(cx.theme().colors().surface_background)
// TODO: Add focus state
// .when(self.state == InteractionState::Focused, |this| {
// this.border()
@ -399,7 +399,7 @@ impl ListEntry {
div()
.relative()
.group("")
.bg(cx.theme().colors().surface)
.bg(cx.theme().colors().surface_background)
.when(self.state == InteractionState::Focused, |this| {
this.border()
.border_color(cx.theme().colors().border_focused)
@ -490,7 +490,7 @@ impl<V: 'static> ListDetailsEntry<V> {
let settings = user_settings(cx);
let (item_bg, item_bg_hover, item_bg_active) = (
cx.theme().colors().ghost_element,
cx.theme().colors().ghost_element_background,
cx.theme().colors().ghost_element_hover,
cx.theme().colors().ghost_element_active,
);
@ -516,7 +516,7 @@ impl<V: 'static> ListDetailsEntry<V> {
.top_3()
.rounded_full()
.border_2()
.border_color(cx.theme().colors().surface)
.border_color(cx.theme().colors().surface_background)
.w(px(9.0))
.h(px(9.0))
.z_index(2)

View file

@ -24,7 +24,7 @@ impl MultiBuffer {
.items_center()
.justify_between()
.p_4()
.bg(cx.theme().colors().editor_subheader)
.bg(cx.theme().colors().editor_subheader_background)
.child(Label::new("main.rs"))
.child(IconButton::new("arrow_up_right", Icon::ArrowUpRight)),
)

View file

@ -34,7 +34,7 @@ impl NotificationToast {
.px_1p5()
.rounded_lg()
.shadow_md()
.bg(cx.theme().colors().elevated_surface)
.bg(cx.theme().colors().elevated_surface_background)
.child(div().size_full().child(self.label.clone()))
}
}

View file

@ -22,7 +22,7 @@ impl NotificationsPanel {
.flex()
.flex_col()
.size_full()
.bg(cx.theme().colors().surface)
.bg(cx.theme().colors().surface_background)
.child(
ListHeader::new("Notifications").meta(Some(ListHeaderMeta::Tools(vec![
Icon::AtSign,
@ -43,7 +43,7 @@ impl NotificationsPanel {
.p_1()
// TODO: Add cursor style
// .cursor(Cursor::IBeam)
.bg(cx.theme().colors().element)
.bg(cx.theme().colors().element_background)
.border()
.border_color(cx.theme().colors().border_variant)
.child(

View file

@ -47,7 +47,7 @@ impl Palette {
.id(self.id.clone())
.w_96()
.rounded_lg()
.bg(cx.theme().colors().elevated_surface)
.bg(cx.theme().colors().elevated_surface_background)
.border()
.border_color(cx.theme().colors().border)
.child(
@ -56,7 +56,12 @@ impl Palette {
.child(v_stack().py_0p5().px_1().child(div().px_2().py_0p5().child(
Label::new(self.input_placeholder.clone()).color(LabelColor::Placeholder),
)))
.child(div().h_px().w_full().bg(cx.theme().colors().element))
.child(
div()
.h_px()
.w_full()
.bg(cx.theme().colors().element_background),
)
.child(
v_stack()
.id("items")

View file

@ -107,7 +107,7 @@ impl<V: 'static> Panel<V> {
PanelSide::Right => this.border_l(),
PanelSide::Bottom => this.border_b().w_full().h(current_size),
})
.bg(cx.theme().colors().surface)
.bg(cx.theme().colors().surface_background)
.border_color(cx.theme().colors().border)
.children(self.children)
}

View file

@ -113,7 +113,7 @@ impl<V: 'static> PaneGroup<V> {
.gap_px()
.w_full()
.h_full()
.bg(cx.theme().colors().editor)
.bg(cx.theme().colors().editor_background)
.children(self.groups.into_iter().map(|group| group.render(view, cx)));
if self.split_direction == SplitDirection::Horizontal {

View file

@ -20,7 +20,7 @@ impl ProjectPanel {
.flex_col()
.w_full()
.h_full()
.bg(cx.theme().colors().surface)
.bg(cx.theme().colors().surface_background)
.child(
div()
.id("project-panel-contents")

View file

@ -93,7 +93,7 @@ impl StatusBar {
.items_center()
.justify_between()
.w_full()
.bg(cx.theme().colors().status_bar)
.bg(cx.theme().colors().status_bar_background)
.child(self.left_tools(view, cx))
.child(self.right_tools(view, cx))
}

View file

@ -109,12 +109,12 @@ impl Tab {
let (tab_bg, tab_hover_bg, tab_active_bg) = match self.current {
false => (
cx.theme().colors().tab_inactive,
cx.theme().colors().tab_inactive_background,
cx.theme().colors().ghost_element_hover,
cx.theme().colors().ghost_element_active,
),
true => (
cx.theme().colors().tab_active,
cx.theme().colors().tab_active_background,
cx.theme().colors().element_hover,
cx.theme().colors().element_active,
),

View file

@ -31,7 +31,7 @@ impl TabBar {
.id(self.id.clone())
.w_full()
.flex()
.bg(cx.theme().colors().tab_bar)
.bg(cx.theme().colors().tab_bar_background)
// Left Side
.child(
div()

View file

@ -24,7 +24,7 @@ impl Terminal {
div()
.w_full()
.flex()
.bg(cx.theme().colors().surface)
.bg(cx.theme().colors().surface_background)
.child(
div().px_1().flex().flex_none().gap_2().child(
div()

View file

@ -54,7 +54,7 @@ impl<V: 'static> Toast<V> {
.rounded_lg()
.shadow_md()
.overflow_hidden()
.bg(cx.theme().colors().elevated_surface)
.bg(cx.theme().colors().elevated_surface_background)
.children(self.children)
}
}

View file

@ -56,7 +56,7 @@ impl<V: 'static> Toolbar<V> {
fn render(self, _view: &mut V, cx: &mut ViewContext<V>) -> impl Component<V> {
div()
.bg(cx.theme().colors().toolbar)
.bg(cx.theme().colors().toolbar_background)
.p_2()
.flex()
.justify_between()

View file

@ -28,7 +28,7 @@ impl TrafficLight {
(true, TrafficLightColor::Red) => system_colors.mac_os_traffic_light_red,
(true, TrafficLightColor::Yellow) => system_colors.mac_os_traffic_light_yellow,
(true, TrafficLightColor::Green) => system_colors.mac_os_traffic_light_green,
(false, _) => cx.theme().colors().element,
(false, _) => cx.theme().colors().element_background,
};
div().w_3().h_3().rounded_full().bg(fill)

View file

@ -22,8 +22,8 @@ pub enum ButtonVariant {
impl ButtonVariant {
pub fn bg_color(&self, cx: &mut WindowContext) -> Hsla {
match self {
ButtonVariant::Ghost => cx.theme().colors().ghost_element,
ButtonVariant::Filled => cx.theme().colors().element,
ButtonVariant::Ghost => cx.theme().colors().ghost_element_background,
ButtonVariant::Filled => cx.theme().colors().element_background,
}
}

View file

@ -14,7 +14,7 @@ impl UnreadIndicator {
div()
.rounded_full()
.border_2()
.border_color(cx.theme().colors().surface)
.border_color(cx.theme().colors().surface_background)
.w(px(9.0))
.h(px(9.0))
.z_index(2)

View file

@ -59,12 +59,12 @@ impl Input {
fn render<V: 'static>(self, _view: &mut V, cx: &mut ViewContext<V>) -> impl Component<V> {
let (input_bg, input_hover_bg, input_active_bg) = match self.variant {
InputVariant::Ghost => (
cx.theme().colors().ghost_element,
cx.theme().colors().ghost_element_background,
cx.theme().colors().ghost_element_hover,
cx.theme().colors().ghost_element_active,
),
InputVariant::Filled => (
cx.theme().colors().element,
cx.theme().colors().element_background,
cx.theme().colors().element_hover,
cx.theme().colors().element_active,
),