Rename fields in `ThemeColors` (#3242)

Marshall Bowers , Nate Butler , and Marshall Bowers created

This PR applies a number of field renames in the `ThemeColors` struct
from the `import-theme` branch.

This will help prevent this branch from diverging too far from `main`.

Release Notes:

- N/A

---------

Co-authored-by: Nate Butler <iamnbutler@gmail.com>
Co-authored-by: Marshall Bowers <1486634+maxdeviant@users.noreply.github.com>

Change summary

crates/theme2/src/colors.rs                      | 41 ++++++--
crates/theme2/src/default_colors.rs              | 82 ++++++++++++-----
crates/theme2/src/theme2.rs                      |  2 
crates/theme2/src/themes/.gitkeep                |  0 
crates/ui2/src/components/button.rs              |  4 
crates/ui2/src/components/checkbox.rs            |  5 
crates/ui2/src/components/context_menu.rs        |  2 
crates/ui2/src/components/icon_button.rs         |  4 
crates/ui2/src/components/indicator.rs           |  2 
crates/ui2/src/components/input.rs               |  4 
crates/ui2/src/components/keybinding.rs          |  2 
crates/ui2/src/components/list.rs                |  4 
crates/ui2/src/components/notification_toast.rs  |  2 
crates/ui2/src/components/palette.rs             |  9 +
crates/ui2/src/components/panel.rs               |  2 
crates/ui2/src/components/tab.rs                 |  4 
crates/ui2/src/components/toast.rs               |  2 
crates/ui2/src/to_extract/buffer.rs              |  2 
crates/ui2/src/to_extract/buffer_search.rs       | 21 ++-
crates/ui2/src/to_extract/collab_panel.rs        |  2 
crates/ui2/src/to_extract/multi_buffer.rs        |  2 
crates/ui2/src/to_extract/notifications_panel.rs |  4 
crates/ui2/src/to_extract/panes.rs               |  2 
crates/ui2/src/to_extract/project_panel.rs       |  2 
crates/ui2/src/to_extract/status_bar.rs          |  2 
crates/ui2/src/to_extract/tab_bar.rs             |  2 
crates/ui2/src/to_extract/terminal.rs            |  2 
crates/ui2/src/to_extract/toolbar.rs             |  2 
crates/ui2/src/to_extract/traffic_lights.rs      |  2 
crates/workspace2/src/pane.rs                    |  6 
crates/workspace2/src/status_bar.rs              |  2 
crates/workspace2/src/workspace2.rs              |  2 
32 files changed, 144 insertions(+), 82 deletions(-)

Detailed changes

crates/theme2/src/colors.rs 🔗

@@ -57,17 +57,17 @@ pub struct ThemeColors {
     pub border_selected: Hsla,
     pub border_transparent: Hsla,
     pub border_disabled: Hsla,
-    pub elevated_surface: Hsla,
-    pub surface: Hsla,
+    pub elevated_surface_background: Hsla,
+    pub surface_background: Hsla,
     pub background: Hsla,
-    pub element: Hsla,
+    pub element_background: Hsla,
     pub element_hover: Hsla,
     pub element_active: Hsla,
     pub element_selected: Hsla,
     pub element_disabled: Hsla,
     pub element_placeholder: Hsla,
     pub element_drop_target: Hsla,
-    pub ghost_element: Hsla,
+    pub ghost_element_background: Hsla,
     pub ghost_element_hover: Hsla,
     pub ghost_element_active: Hsla,
     pub ghost_element_selected: Hsla,
@@ -82,15 +82,32 @@ pub struct ThemeColors {
     pub icon_disabled: Hsla,
     pub icon_placeholder: Hsla,
     pub icon_accent: Hsla,
-    pub status_bar: Hsla,
-    pub title_bar: Hsla,
-    pub toolbar: Hsla,
-    pub tab_bar: Hsla,
-    pub tab_inactive: Hsla,
-    pub tab_active: Hsla,
-    pub editor: Hsla,
-    pub editor_subheader: Hsla,
+    pub status_bar_background: Hsla,
+    pub title_bar_background: Hsla,
+    pub toolbar_background: Hsla,
+    pub tab_bar_background: Hsla,
+    pub tab_inactive_background: Hsla,
+    pub tab_active_background: Hsla,
+    pub editor_background: Hsla,
+    pub editor_subheader_background: Hsla,
     pub editor_active_line: Hsla,
+    pub terminal_background: Hsla,
+    pub terminal_ansi_bright_black: Hsla,
+    pub terminal_ansi_bright_red: Hsla,
+    pub terminal_ansi_bright_green: Hsla,
+    pub terminal_ansi_bright_yellow: Hsla,
+    pub terminal_ansi_bright_blue: Hsla,
+    pub terminal_ansi_bright_magenta: Hsla,
+    pub terminal_ansi_bright_cyan: Hsla,
+    pub terminal_ansi_bright_white: Hsla,
+    pub terminal_ansi_black: Hsla,
+    pub terminal_ansi_red: Hsla,
+    pub terminal_ansi_green: Hsla,
+    pub terminal_ansi_yellow: Hsla,
+    pub terminal_ansi_blue: Hsla,
+    pub terminal_ansi_magenta: Hsla,
+    pub terminal_ansi_cyan: Hsla,
+    pub terminal_ansi_white: Hsla,
 }
 
 #[derive(Refineable, Clone)]

crates/theme2/src/default_colors.rs 🔗

@@ -208,17 +208,17 @@ impl ThemeColors {
             border_disabled: neutral().light().step_3(),
             border_selected: blue().light().step_5(),
             border_transparent: system.transparent,
-            elevated_surface: neutral().light().step_2(),
-            surface: neutral().light().step_2(),
+            elevated_surface_background: neutral().light().step_2(),
+            surface_background: neutral().light().step_2(),
             background: neutral().light().step_1(),
-            element: neutral().light().step_3(),
+            element_background: neutral().light().step_3(),
             element_hover: neutral().light().step_4(),
             element_active: neutral().light().step_5(),
             element_selected: neutral().light().step_5(),
             element_disabled: neutral().light_alpha().step_3(),
             element_placeholder: neutral().light().step_11(),
             element_drop_target: blue().light_alpha().step_2(),
-            ghost_element: system.transparent,
+            ghost_element_background: system.transparent,
             ghost_element_hover: neutral().light().step_4(),
             ghost_element_active: neutral().light().step_5(),
             ghost_element_selected: neutral().light().step_5(),
@@ -233,15 +233,32 @@ impl ThemeColors {
             icon_disabled: neutral().light().step_9(),
             icon_placeholder: neutral().light().step_10(),
             icon_accent: blue().light().step_11(),
-            status_bar: neutral().light().step_2(),
-            title_bar: neutral().light().step_2(),
-            toolbar: neutral().light().step_1(),
-            tab_bar: neutral().light().step_2(),
-            tab_active: neutral().light().step_1(),
-            tab_inactive: neutral().light().step_2(),
-            editor: neutral().light().step_1(),
-            editor_subheader: neutral().light().step_2(),
+            status_bar_background: neutral().light().step_2(),
+            title_bar_background: neutral().light().step_2(),
+            toolbar_background: neutral().light().step_1(),
+            tab_bar_background: neutral().light().step_2(),
+            tab_active_background: neutral().light().step_1(),
+            tab_inactive_background: neutral().light().step_2(),
+            editor_background: neutral().light().step_1(),
+            editor_subheader_background: neutral().light().step_2(),
             editor_active_line: neutral().light_alpha().step_3(),
+            terminal_background: neutral().light().step_1(),
+            terminal_ansi_black: black().light().step_12(),
+            terminal_ansi_red: red().light().step_11(),
+            terminal_ansi_green: green().light().step_11(),
+            terminal_ansi_yellow: yellow().light().step_11(),
+            terminal_ansi_blue: blue().light().step_11(),
+            terminal_ansi_magenta: violet().light().step_11(),
+            terminal_ansi_cyan: cyan().light().step_11(),
+            terminal_ansi_white: neutral().light().step_12(),
+            terminal_ansi_bright_black: black().light().step_11(),
+            terminal_ansi_bright_red: red().light().step_10(),
+            terminal_ansi_bright_green: green().light().step_10(),
+            terminal_ansi_bright_yellow: yellow().light().step_10(),
+            terminal_ansi_bright_blue: blue().light().step_10(),
+            terminal_ansi_bright_magenta: violet().light().step_10(),
+            terminal_ansi_bright_cyan: cyan().light().step_10(),
+            terminal_ansi_bright_white: neutral().light().step_11(),
         }
     }
 
@@ -255,17 +272,17 @@ impl ThemeColors {
             border_disabled: neutral().dark().step_3(),
             border_selected: blue().dark().step_5(),
             border_transparent: system.transparent,
-            elevated_surface: neutral().dark().step_2(),
-            surface: neutral().dark().step_2(),
+            elevated_surface_background: neutral().dark().step_2(),
+            surface_background: neutral().dark().step_2(),
             background: neutral().dark().step_1(),
-            element: neutral().dark().step_3(),
+            element_background: neutral().dark().step_3(),
             element_hover: neutral().dark().step_4(),
             element_active: neutral().dark().step_5(),
             element_selected: neutral().dark().step_5(),
             element_disabled: neutral().dark_alpha().step_3(),
             element_placeholder: neutral().dark().step_11(),
             element_drop_target: blue().dark_alpha().step_2(),
-            ghost_element: system.transparent,
+            ghost_element_background: system.transparent,
             ghost_element_hover: neutral().dark().step_4(),
             ghost_element_active: neutral().dark().step_5(),
             ghost_element_selected: neutral().dark().step_5(),
@@ -280,15 +297,32 @@ impl ThemeColors {
             icon_disabled: neutral().dark().step_9(),
             icon_placeholder: neutral().dark().step_10(),
             icon_accent: blue().dark().step_11(),
-            status_bar: neutral().dark().step_2(),
-            title_bar: neutral().dark().step_2(),
-            toolbar: neutral().dark().step_1(),
-            tab_bar: neutral().dark().step_2(),
-            tab_active: neutral().dark().step_1(),
-            tab_inactive: neutral().dark().step_2(),
-            editor: neutral().dark().step_1(),
-            editor_subheader: neutral().dark().step_2(),
+            status_bar_background: neutral().dark().step_2(),
+            title_bar_background: neutral().dark().step_2(),
+            toolbar_background: neutral().dark().step_1(),
+            tab_bar_background: neutral().dark().step_2(),
+            tab_active_background: neutral().dark().step_1(),
+            tab_inactive_background: neutral().dark().step_2(),
+            editor_background: neutral().dark().step_1(),
+            editor_subheader_background: neutral().dark().step_2(),
             editor_active_line: neutral().dark_alpha().step_3(),
+            terminal_background: neutral().dark().step_1(),
+            terminal_ansi_black: black().dark().step_12(),
+            terminal_ansi_red: red().dark().step_11(),
+            terminal_ansi_green: green().dark().step_11(),
+            terminal_ansi_yellow: yellow().dark().step_11(),
+            terminal_ansi_blue: blue().dark().step_11(),
+            terminal_ansi_magenta: violet().dark().step_11(),
+            terminal_ansi_cyan: cyan().dark().step_11(),
+            terminal_ansi_white: neutral().dark().step_12(),
+            terminal_ansi_bright_black: black().dark().step_11(),
+            terminal_ansi_bright_red: red().dark().step_10(),
+            terminal_ansi_bright_green: green().dark().step_10(),
+            terminal_ansi_bright_yellow: yellow().dark().step_10(),
+            terminal_ansi_bright_blue: blue().dark().step_10(),
+            terminal_ansi_bright_magenta: violet().dark().step_10(),
+            terminal_ansi_bright_cyan: cyan().dark().step_10(),
+            terminal_ansi_bright_white: neutral().dark().step_11(),
         }
     }
 }

crates/theme2/src/theme2.rs 🔗

@@ -17,7 +17,7 @@ pub use syntax::*;
 
 use gpui::{AppContext, Hsla, SharedString};
 
-#[derive(Debug, Clone, PartialEq)]
+#[derive(Debug, PartialEq, Clone, Copy)]
 pub enum Appearance {
     Light,
     Dark,

crates/ui2/src/components/button.rs 🔗

@@ -41,8 +41,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,
         }
     }
 

crates/ui2/src/components/checkbox.rs 🔗

@@ -120,7 +120,10 @@ impl Checkbox {
                 cx.theme().colors().element_selected,
                 cx.theme().colors().border,
             ),
-            (false, false) => (cx.theme().colors().element, cx.theme().colors().border),
+            (false, false) => (
+                cx.theme().colors().element_background,
+                cx.theme().colors().border,
+            ),
         };
 
         div()

crates/ui2/src/components/context_menu.rs 🔗

@@ -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(List::new(

crates/ui2/src/components/icon_button.rs 🔗

@@ -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,
             ),

crates/ui2/src/components/indicator.rs 🔗

@@ -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)

crates/ui2/src/components/input.rs 🔗

@@ -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,
             ),

crates/ui2/src/components/keybinding.rs 🔗

@@ -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())
     }
 }

crates/ui2/src/components/list.rs 🔗

@@ -79,7 +79,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()
@@ -307,7 +307,7 @@ impl ListEntry {
         div()
             .relative()
             .group("")
-            .bg(cx.theme().colors().surface)
+            .bg(cx.theme().colors().surface_background)
             // TODO: Add focus state
             .child(
                 sized_item

crates/ui2/src/components/notification_toast.rs 🔗

@@ -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()))
     }
 }

crates/ui2/src/components/palette.rs 🔗

@@ -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")

crates/ui2/src/components/panel.rs 🔗

@@ -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)
     }

crates/ui2/src/components/tab.rs 🔗

@@ -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,
             ),

crates/ui2/src/components/toast.rs 🔗

@@ -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)
     }
 }

crates/ui2/src/to_extract/buffer.rs 🔗

@@ -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)
     }
 }

crates/ui2/src/to_extract/buffer_search.rs 🔗

@@ -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);
+                        }),
+                ),
+            )
     }
 }

crates/ui2/src/to_extract/collab_panel.rs 🔗

@@ -17,7 +17,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")

crates/ui2/src/to_extract/multi_buffer.rs 🔗

@@ -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)),
                     )

crates/ui2/src/to_extract/notifications_panel.rs 🔗

@@ -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(

crates/ui2/src/to_extract/panes.rs 🔗

@@ -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 {

crates/ui2/src/to_extract/project_panel.rs 🔗

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

crates/ui2/src/to_extract/status_bar.rs 🔗

@@ -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))
     }

crates/ui2/src/to_extract/tab_bar.rs 🔗

@@ -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()

crates/ui2/src/to_extract/terminal.rs 🔗

@@ -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()

crates/ui2/src/to_extract/toolbar.rs 🔗

@@ -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()

crates/ui2/src/to_extract/traffic_lights.rs 🔗

@@ -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)

crates/workspace2/src/pane.rs 🔗

@@ -1363,12 +1363,12 @@ impl Pane {
 
         let (tab_bg, tab_hover_bg, tab_active_bg) = match ix == self.active_item_index {
             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,
             ),
@@ -1432,7 +1432,7 @@ impl Pane {
             .id("tab_bar")
             .w_full()
             .flex()
-            .bg(cx.theme().colors().tab_bar)
+            .bg(cx.theme().colors().tab_bar_background)
             // Left Side
             .child(
                 div()

crates/workspace2/src/status_bar.rs 🔗

@@ -44,7 +44,7 @@ impl Render for StatusBar {
             .items_center()
             .justify_between()
             .w_full()
-            .bg(cx.theme().colors().status_bar)
+            .bg(cx.theme().colors().status_bar_background)
             .child(self.render_left_tools(cx))
             .child(self.render_right_tools(cx))
     }

crates/workspace2/src/workspace2.rs 🔗

@@ -2697,7 +2697,7 @@ impl Workspace {
 
     fn render_titlebar(&self, cx: &mut ViewContext<Self>) -> impl Component<Self> {
         div()
-            .bg(cx.theme().colors().title_bar)
+            .bg(cx.theme().colors().title_bar_background)
             .when(
                 !matches!(cx.window_bounds(), WindowBounds::Fullscreen),
                 |s| s.pl_20(),