Use `enabled` for active tabs

Nate Butler created

Change summary

crates/storybook/src/components/icon_button.rs |  3 +--
crates/storybook/src/components/tab.rs         | 14 +++++++-------
crates/storybook/src/modules/tab_bar.rs        |  2 +-
3 files changed, 9 insertions(+), 10 deletions(-)

Detailed changes

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

@@ -25,9 +25,8 @@ impl IconButton {
         let theme = theme(cx);
 
         let mut div = div();
-
         if self.variant == ButtonVariant::Filled {
-            div = div.fill(theme.highest.negative.default.background);
+            div = div.fill(theme.highest.on.default.background);
         }
 
         div.w_7()

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

@@ -6,11 +6,11 @@ use gpui2::{Element, ParentElement, ViewContext};
 #[derive(Element)]
 pub(crate) struct Tab {
     title: &'static str,
-    active: bool,
+    enabled: bool,
 }
 
-pub fn tab<V: 'static>(title: &'static str, active: bool) -> impl Element<V> {
-    Tab { title, active }
+pub fn tab<V: 'static>(title: &'static str, enabled: bool) -> impl Element<V> {
+    Tab { title, enabled }
 }
 
 impl Tab {
@@ -24,19 +24,19 @@ impl Tab {
             .items_center()
             .justify_center()
             .rounded_lg()
-            .fill(if self.active {
+            .fill(if self.enabled {
                 theme.highest.on.default.background
             } else {
                 theme.highest.base.default.background
             })
             .hover()
-            .fill(if self.active {
+            .fill(if self.enabled {
                 theme.highest.on.hovered.background
             } else {
                 theme.highest.base.hovered.background
             })
             .active()
-            .fill(if self.active {
+            .fill(if self.enabled {
                 theme.highest.on.pressed.background
             } else {
                 theme.highest.base.pressed.background
@@ -44,7 +44,7 @@ impl Tab {
             .child(
                 div()
                     .text_sm()
-                    .text_color(if self.active {
+                    .text_color(if self.enabled {
                         theme.highest.base.default.foreground
                     } else {
                         theme.highest.variant.default.foreground

crates/storybook/src/modules/tab_bar.rs 🔗

@@ -40,7 +40,7 @@ impl<V: 'static> TabBar<V> {
                             .flex()
                             .items_center()
                             .gap_px()
-                            .child(icon_button("icons/arrow_left.svg", ButtonVariant::Ghost))
+                            .child(icon_button("icons/arrow_left.svg", ButtonVariant::Filled))
                             .child(icon_button("icons/arrow_right.svg", ButtonVariant::Ghost)),
                     ),
             )