diff --git a/assets/icons/audio_off.svg b/assets/icons/audio_off.svg index 93b98471ca1a15e4ef92860e953dde8beb559c37..dfb5a1c45829119ea0dc89bbca3a3f33228ee88f 100644 --- a/assets/icons/audio_off.svg +++ b/assets/icons/audio_off.svg @@ -1 +1,7 @@ - + + + + + + + diff --git a/assets/icons/audio_on.svg b/assets/icons/audio_on.svg index 42310ea32c289e2ecf24a6fa231ae55fce3cb05e..d1bef0d337d6c8a0e79cb0dab8b7d63d5cb2a4d1 100644 --- a/assets/icons/audio_on.svg +++ b/assets/icons/audio_on.svg @@ -1 +1,5 @@ - + + + + + diff --git a/assets/icons/exit.svg b/assets/icons/exit.svg index 2cc6ce120dc9af17a642ac3bf2f2451209cb5e5e..1ff9d7882441548e9c3534ae5ffe6b6331391b45 100644 --- a/assets/icons/exit.svg +++ b/assets/icons/exit.svg @@ -1,8 +1,5 @@ - - + + + + diff --git a/assets/icons/mic.svg b/assets/icons/mic.svg index 01f4c9bf669ba253edaa43dc641fdb9a1b7c51d1..1d9c5bc9edf2a48b3311965fb57758b3ee2e015e 100644 --- a/assets/icons/mic.svg +++ b/assets/icons/mic.svg @@ -1,3 +1,5 @@ - - + + + + diff --git a/assets/icons/mic_mute.svg b/assets/icons/mic_mute.svg index fe5f8201cc4da5e2cf6a1b770c538d421994e1c4..8c61ae2f1ccedc1b27244ed80e1a3fdd75cd4120 100644 --- a/assets/icons/mic_mute.svg +++ b/assets/icons/mic_mute.svg @@ -1,3 +1,8 @@ - - + + + + + + + diff --git a/assets/icons/screen.svg b/assets/icons/screen.svg index ad252e64cf5c73d4cd6ae48dd0abede47d3323e6..4b686b58f9de2e4993546ddad1a20af395d50330 100644 --- a/assets/icons/screen.svg +++ b/assets/icons/screen.svg @@ -1,8 +1,5 @@ - - + + + + diff --git a/crates/title_bar/src/collab.rs b/crates/title_bar/src/collab.rs index 056c981ccf16a1e56fcaff99c32b4a284553a706..d026b4de14263f442c1ede308da0fe467fe69bba 100644 --- a/crates/title_bar/src/collab.rs +++ b/crates/title_bar/src/collab.rs @@ -11,8 +11,8 @@ use gpui::{App, Task, Window, actions}; use rpc::proto::{self}; use theme::ActiveTheme; use ui::{ - Avatar, AvatarAudioStatusIndicator, ContextMenu, ContextMenuItem, Divider, Facepile, - PopoverMenu, SplitButton, SplitButtonStyle, TintColor, Tooltip, prelude::*, + Avatar, AvatarAudioStatusIndicator, ContextMenu, ContextMenuItem, Divider, DividerColor, + Facepile, PopoverMenu, SplitButton, SplitButtonStyle, TintColor, Tooltip, prelude::*, }; use util::maybe; use workspace::notifications::DetachAndPromptErr; @@ -343,6 +343,24 @@ impl TitleBar { let mut children = Vec::new(); + children.push( + h_flex() + .gap_1() + .child( + IconButton::new("leave-call", IconName::Exit) + .style(ButtonStyle::Subtle) + .tooltip(Tooltip::text("Leave Call")) + .icon_size(IconSize::Small) + .on_click(move |_, _window, cx| { + ActiveCall::global(cx) + .update(cx, |call, cx| call.hang_up(cx)) + .detach_and_log_err(cx); + }), + ) + .child(Divider::vertical().color(DividerColor::Border)) + .into_any_element(), + ); + if is_local && can_share_projects && !is_connecting_to_project { children.push( Button::new( @@ -369,32 +387,14 @@ impl TitleBar { ); } - children.push( - div() - .pr_2() - .child( - IconButton::new("leave-call", ui::IconName::Exit) - .style(ButtonStyle::Subtle) - .tooltip(Tooltip::text("Leave call")) - .icon_size(IconSize::Small) - .on_click(move |_, _window, cx| { - ActiveCall::global(cx) - .update(cx, |call, cx| call.hang_up(cx)) - .detach_and_log_err(cx); - }), - ) - .child(Divider::vertical()) - .into_any_element(), - ); - if can_use_microphone { children.push( IconButton::new( "mute-microphone", if is_muted { - ui::IconName::MicMute + IconName::MicMute } else { - ui::IconName::Mic + IconName::Mic }, ) .tooltip(move |window, cx| { @@ -429,9 +429,9 @@ impl TitleBar { IconButton::new( "mute-sound", if is_deafened { - ui::IconName::AudioOff + IconName::AudioOff } else { - ui::IconName::AudioOn + IconName::AudioOn }, ) .style(ButtonStyle::Subtle) @@ -462,7 +462,7 @@ impl TitleBar { ); if can_use_microphone && screen_sharing_supported { - let trigger = IconButton::new("screen-share", ui::IconName::Screen) + let trigger = IconButton::new("screen-share", IconName::Screen) .style(ButtonStyle::Subtle) .icon_size(IconSize::Small) .toggle_state(is_screen_sharing) @@ -498,7 +498,7 @@ impl TitleBar { trigger.render(window, cx), self.render_screen_list().into_any_element(), ) - .style(SplitButtonStyle::Outlined) + .style(SplitButtonStyle::Transparent) .into_any_element(), ); } @@ -513,11 +513,11 @@ impl TitleBar { .with_handle(self.screen_share_popover_handle.clone()) .trigger( ui::ButtonLike::new_rounded_right("screen-share-screen-list-trigger") - .layer(ui::ElevationIndex::ModalSurface) - .size(ui::ButtonSize::None) .child( - div() - .px_1() + h_flex() + .mx_neg_0p5() + .h_full() + .justify_center() .child(Icon::new(IconName::ChevronDownSmall).size(IconSize::XSmall)), ) .toggle_state(self.screen_share_popover_handle.is_deployed()), diff --git a/crates/ui/src/components/button/split_button.rs b/crates/ui/src/components/button/split_button.rs index a7fa2106d127662c4f1498e41372780065649e56..14b9fd153cd5ad662467c75ff81700587667cee3 100644 --- a/crates/ui/src/components/button/split_button.rs +++ b/crates/ui/src/components/button/split_button.rs @@ -12,6 +12,7 @@ use super::ButtonLike; pub enum SplitButtonStyle { Filled, Outlined, + Transparent, } /// /// A button with two parts: a primary action on the left and a secondary action on the right. @@ -44,10 +45,17 @@ impl SplitButton { impl RenderOnce for SplitButton { fn render(self, _window: &mut Window, cx: &mut App) -> impl IntoElement { + let is_filled_or_outlined = matches!( + self.style, + SplitButtonStyle::Filled | SplitButtonStyle::Outlined + ); + h_flex() .rounded_sm() - .border_1() - .border_color(cx.theme().colors().border.opacity(0.5)) + .when(is_filled_or_outlined, |this| { + this.border_1() + .border_color(cx.theme().colors().border.opacity(0.8)) + }) .child(div().flex_grow().child(self.left)) .child( div()