Yehowshua/ZIm
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Update call controls & Add tinted buttons (#3886)

Browse source 
This PR introduces Tinted button styles and the `selected_style` field
on buttons to allow replicating the previous design of titlebar call
controls. It also updates the styles of the titlebar controls.

### Creating a tinted button:

```
Button::new("accept-cta", "Accept")
    .style(ButtonStyle::Tinted(TintColor::Accent))
    .on_click(...)
```

Ths button will always be tinted blue.

### Creating a button that becomes tinted when selected::

```rust
IconButton::new("screen-share", Icon::Screen)
    .style(ButtonStyle::Subtle)
    .selected(is_screen_sharing)
    .selected_style(ButtonStyle::Tinted(TintColor::Accent))
    .on_click(...),
```

This button will be flat/subtle by default, but be tinted blue when it
is `selected`.

Note: There appears to be some issue where `is_deafened` isn't
activating correctly, making the speaker icon not toggle when selected.

Release Notes:

- Restore call control styles to a similar look to Zed 1.
This commit is contained in:
Nate Butler 2024-01-05 11:28:18 -05:00 • committed by GitHub
commit a205b2dbf3
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 122 additions and 39 deletions
Download patch file Download diff file Expand all files Collapse all files

7
crates/collab_ui/src/collab_titlebar_item.rs
View file

@ -14,7 +14,7 @@ use std::sync::Arc;
use theme::{ActiveTheme, PlayerColors};
use ui::{
h_stack, popover_menu, prelude::*, Avatar, Button, ButtonLike, ButtonStyle, ContextMenu, Icon,
IconButton, IconElement, Tooltip,
IconButton, IconElement, TintColor, Tooltip,
};
use util::ResultExt;
use vcs_menu::{build_branch_list, BranchList, OpenRecent as ToggleVcsMenu};
@ -183,6 +183,8 @@ impl Render for CollabTitlebarItem {
if is_shared { "Unshare" } else { "Share" },
)
.style(ButtonStyle::Subtle)
.selected_style(ButtonStyle::Tinted(TintColor::Accent))
.selected(is_shared)
.label_size(LabelSize::Small)
.on_click(cx.listener(
move |this, _, cx| {
@ -215,6 +217,7 @@ impl Render for CollabTitlebarItem {
},
)
.style(ButtonStyle::Subtle)
.selected_style(ButtonStyle::Tinted(TintColor::Negative))
.icon_size(IconSize::Small)
.selected(is_muted)
.on_click(move |_, cx| crate::toggle_mute(&Default::default(), cx)),
@ -229,6 +232,7 @@ impl Render for CollabTitlebarItem {
},
)
.style(ButtonStyle::Subtle)
.selected_style(ButtonStyle::Tinted(TintColor::Negative))
.icon_size(IconSize::Small)
.selected(is_deafened)
.tooltip(move |cx| {
@ -239,6 +243,7 @@ impl Render for CollabTitlebarItem {
.child(
IconButton::new("screen-share", ui::Icon::Screen)
.style(ButtonStyle::Subtle)
.selected_style(ButtonStyle::Tinted(TintColor::Accent))
.icon_size(IconSize::Small)
.selected(is_screen_sharing)
.on_click(move |_, cx| {