diff --git a/crates/collab_ui/src/chat_panel.rs b/crates/collab_ui/src/chat_panel.rs index 5a79f364ff571f1b68d222f8da8b3dfcc10ec1e8..b330b5b5316e9011af11fffe57ada8ed3a719d4e 100644 --- a/crates/collab_ui/src/chat_panel.rs +++ b/crates/collab_ui/src/chat_panel.rs @@ -23,7 +23,7 @@ use std::{sync::Arc, time::Duration}; use time::{OffsetDateTime, UtcOffset}; use ui::{ prelude::*, Avatar, Button, ContextMenu, IconButton, IconName, KeyBinding, Label, PopoverMenu, - TabBar, Tooltip, + Tab, TabBar, Tooltip, }; use util::{ResultExt, TryFutureExt}; use workspace::{ @@ -939,7 +939,7 @@ impl Render for ChatPanel { TabBar::new("chat_header").child( h_flex() .w_full() - .h(rems(ui::Tab::CONTAINER_HEIGHT_IN_REMS)) + .h(Tab::container_height(cx)) .px_2() .child(Label::new( self.active_chat diff --git a/crates/collab_ui/src/notification_panel.rs b/crates/collab_ui/src/notification_panel.rs index 33ca5a2952180c06060e444fcf43898ba17ed402..410b90c7271bb8d37312c58bbf272cfb9f88a037 100644 --- a/crates/collab_ui/src/notification_panel.rs +++ b/crates/collab_ui/src/notification_panel.rs @@ -19,7 +19,9 @@ use serde::{Deserialize, Serialize}; use settings::{Settings, SettingsStore}; use std::{sync::Arc, time::Duration}; use time::{OffsetDateTime, UtcOffset}; -use ui::{h_flex, prelude::*, v_flex, Avatar, Button, Icon, IconButton, IconName, Label, Tooltip}; +use ui::{ + h_flex, prelude::*, v_flex, Avatar, Button, Icon, IconButton, IconName, Label, Tab, Tooltip, +}; use util::{ResultExt, TryFutureExt}; use workspace::notifications::NotificationId; use workspace::{ @@ -588,7 +590,7 @@ impl Render for NotificationPanel { .px_2() .py_1() // Match the height of the tab bar so they line up. - .h(rems(ui::Tab::CONTAINER_HEIGHT_IN_REMS)) + .h(Tab::container_height(cx)) .border_b_1() .border_color(cx.theme().colors().border) .child(Label::new("Notifications")) diff --git a/crates/ui/src/components/tab.rs b/crates/ui/src/components/tab.rs index 1a2c1595cfada5d19c2c3c10e07ac09d1c3597f3..e33fc732da0bfa2343bb86aec0486b7a1a7eb307 100644 --- a/crates/ui/src/components/tab.rs +++ b/crates/ui/src/components/tab.rs @@ -4,7 +4,7 @@ use std::cmp::Ordering; use gpui::{AnyElement, IntoElement, Stateful}; use smallvec::SmallVec; -use crate::{prelude::*, BASE_REM_SIZE_IN_PX}; +use crate::prelude::*; /// The position of a [`Tab`] within a list of tabs. #[derive(Debug, PartialEq, Eq, Clone, Copy)] @@ -54,10 +54,6 @@ impl Tab { } } - pub const CONTAINER_HEIGHT_IN_REMS: f32 = 29. / BASE_REM_SIZE_IN_PX; - - const CONTENT_HEIGHT_IN_REMS: f32 = 28. / BASE_REM_SIZE_IN_PX; - pub fn position(mut self, position: TabPosition) -> Self { self.position = position; self @@ -77,6 +73,14 @@ impl Tab { self.end_slot = element.into().map(IntoElement::into_any_element); self } + + pub fn content_height(cx: &mut WindowContext) -> Pixels { + DynamicSpacing::Base32.px(cx) - px(1.) + } + + pub fn container_height(cx: &mut WindowContext) -> Pixels { + DynamicSpacing::Base32.px(cx) + } } impl InteractiveElement for Tab { @@ -130,7 +134,7 @@ impl RenderOnce for Tab { }; self.div - .h(rems(Self::CONTAINER_HEIGHT_IN_REMS)) + .h(Tab::container_height(cx)) .bg(tab_bg) .border_color(cx.theme().colors().border) .map(|this| match self.position { @@ -157,7 +161,7 @@ impl RenderOnce for Tab { h_flex() .group("") .relative() - .h(rems(Self::CONTENT_HEIGHT_IN_REMS)) + .h(Tab::content_height(cx)) .px(DynamicSpacing::Base04.px(cx)) .gap(DynamicSpacing::Base04.rems(cx)) .text_color(text_color) diff --git a/crates/ui/src/components/tab_bar.rs b/crates/ui/src/components/tab_bar.rs index 6aaa2fd59a396976937837f48ac5d3dedc3abfe3..7a169f9701c5f4c6f2a13c19daf2c48ebb7eecb3 100644 --- a/crates/ui/src/components/tab_bar.rs +++ b/crates/ui/src/components/tab_bar.rs @@ -3,6 +3,7 @@ use gpui::{AnyElement, ScrollHandle}; use smallvec::SmallVec; use crate::prelude::*; +use crate::Tab; #[derive(IntoElement)] pub struct TabBar { @@ -97,11 +98,7 @@ impl RenderOnce for TabBar { .flex() .flex_none() .w_full() - .h( - // TODO: This should scale with [UiDensity], however tabs, - // and other tab bar tools need to scale dynamically first. - rems_from_px(29.), - ) + .h(Tab::container_height(cx)) .bg(cx.theme().colors().tab_bar_background) .when(!self.start_children.is_empty(), |this| { this.child( diff --git a/crates/workspace/src/pane.rs b/crates/workspace/src/pane.rs index 52018f53c80e22f0f2d15210408b7d62cfd91bf4..22d06ec21aadf9e206042f885808435f50084250 100644 --- a/crates/workspace/src/pane.rs +++ b/crates/workspace/src/pane.rs @@ -2259,7 +2259,6 @@ impl Pane { fn render_tab_bar(&mut self, cx: &mut ViewContext<'_, Pane>) -> impl IntoElement { let focus_handle = self.focus_handle.clone(); let navigate_backward = IconButton::new("navigate_backward", IconName::ArrowLeft) - .shape(IconButtonShape::Square) .icon_size(IconSize::Small) .on_click({ let view = cx.view().clone(); @@ -2272,7 +2271,6 @@ impl Pane { }); let navigate_forward = IconButton::new("navigate_forward", IconName::ArrowRight) - .shape(IconButtonShape::Square) .icon_size(IconSize::Small) .on_click({ let view = cx.view().clone();