Update some status bar icons and states

Nate Butler created 2 years ago

Change summary

crates/feedback/src/deploy_feedback_button.rs |  2 
crates/project_panel/src/project_panel.rs     |  2 
crates/terminal_view/src/terminal_panel.rs    |  2 
crates/terminal_view/src/terminal_view.rs     |  2 
styles/src/style_tree/status_bar.ts           | 33 +++++++++++---------
5 files changed, 22 insertions(+), 19 deletions(-)

Detailed changes

crates/feedback/src/deploy_feedback_button.rs

@@ -44,7 +44,7 @@ impl View for DeployFeedbackButton {
                         .in_state(active)
                         .style_for(state);
 
-                    Svg::new("icons/feedback_16.svg")
+                    Svg::new("icons/feedback.svg")
                         .with_color(style.icon_color)
                         .constrained()
                         .with_width(style.icon_size)

crates/project_panel/src/project_panel.rs

@@ -1658,7 +1658,7 @@ impl workspace::dock::Panel for ProjectPanel {
     }
 
     fn icon_path(&self, _: &WindowContext) -> Option<&'static str> {
-        Some("icons/folder_tree_16.svg")
+        Some("icons/project.svg")
     }
 
     fn icon_tooltip(&self) -> (String, Option<Box<dyn Action>>) {

crates/terminal_view/src/terminal_panel.rs

@@ -394,7 +394,7 @@ impl Panel for TerminalPanel {
     }
 
     fn icon_path(&self, _: &WindowContext) -> Option<&'static str> {
-        Some("icons/terminal_12.svg")
+        Some("icons/terminal.svg")
     }
 
     fn icon_tooltip(&self) -> (String, Option<Box<dyn Action>>) {

crates/terminal_view/src/terminal_view.rs

@@ -667,7 +667,7 @@ impl Item for TerminalView {
 
         Flex::row()
             .with_child(
-                gpui::elements::Svg::new("icons/terminal_12.svg")
+                gpui::elements::Svg::new("icons/terminal.svg")
                     .with_color(tab_theme.label.text.color)
                     .constrained()
                     .with_width(tab_theme.type_icon_width)

styles/src/style_tree/status_bar.ts

@@ -28,16 +28,16 @@ export default function status_bar(): any {
             right: 6,
         },
         border: border(layer, { top: true, overlay: true }),
-        cursor_position: text(layer, "sans", "variant", { size: "xs" }),
+        cursor_position: text(layer, "sans", "base", { size: "xs" }),
         vim_mode_indicator: {
             margin: { left: 6 },
-            ...text(layer, "mono", "variant", { size: "xs" }),
+            ...text(layer, "mono", "base", { size: "xs" }),
         },
         active_language: text_button({
-            color: "variant"
+            color: "base"
         }),
-        auto_update_progress_message: text(layer, "sans", "variant", { size: "xs" }),
-        auto_update_done_message: text(layer, "sans", "variant", { size: "xs" }),
+        auto_update_progress_message: text(layer, "sans", "base", { size: "xs" }),
+        auto_update_done_message: text(layer, "sans", "base", { size: "xs" }),
         lsp_status: interactive({
             base: {
                 ...diagnostic_status_container,
@@ -64,11 +64,11 @@ export default function status_bar(): any {
         diagnostic_summary: interactive({
             base: {
                 height: 20,
-                icon_width: 16,
+                icon_width: 14,
                 icon_spacing: 2,
                 summary_spacing: 6,
                 text: text(layer, "sans", { size: "sm" }),
-                icon_color_ok: foreground(layer, "variant"),
+                icon_color_ok: foreground(layer, "base"),
                 icon_color_warning: foreground(layer, "warning"),
                 icon_color_error: foreground(layer, "negative"),
                 container_ok: {
@@ -111,8 +111,9 @@ export default function status_bar(): any {
                 base: interactive({
                     base: {
                         ...status_container,
-                        icon_size: 16,
-                        icon_color: foreground(layer, "variant"),
+                        icon_size: 14,
+                        icon_color: foreground(layer, "base"),
+                        background: background(layer, "default"),
                         label: {
                             margin: { left: 6 },
                             ...text(layer, "sans", { size: "xs" }),
@@ -120,23 +121,25 @@ export default function status_bar(): any {
                     },
                     state: {
                         hovered: {
-                            icon_color: foreground(layer, "hovered"),
-                            background: background(layer, "variant"),
+                            background: background(layer, "hovered"),
                         },
+                        clicked: {
+                            background: background(layer, "pressed"),
+                        }
                     },
                 }),
                 state: {
                     active: {
                         default: {
-                            icon_color: foreground(layer, "active"),
-                            background: background(layer, "active"),
+                            icon_color: foreground(layer, "accent", "default"),
+                            background: background(layer, "default"),
                         },
                         hovered: {
-                            icon_color: foreground(layer, "hovered"),
+                            icon_color: foreground(layer, "accent", "hovered"),
                             background: background(layer, "hovered"),
                         },
                         clicked: {
-                            icon_color: foreground(layer, "pressed"),
+                            icon_color: foreground(layer, "accent", "pressed"),
                             background: background(layer, "pressed"),
                         },
                     },