zed-industries/zed
1
1
Fork 0
mirror of https://github.com/zed-industries/zed.git synced 2024-09-19 02:17:35 +03:00
Code Issues Packages Projects Releases Wiki Activity

Make channel buttons square (#4092)

Browse Source 
This PR makes the channel buttons square.

Release Notes:

- Adjusted the shape of the channel buttons.
This commit is contained in:
Marshall Bowers 2024-01-17 11:47:43 -05:00 committed by GitHub
parent 19c488b378
commit df67917768
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 44 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
crates/collab_ui/src/collab_panel.rs
View File

@ -2314,7 +2314,7 @@ impl CollabPanel {
.child(
IconButton::new("channel_chat", IconName::MessageBubbles)
.style(ButtonStyle::Filled)
.size(ButtonSize::Compact)
.shape(ui::IconButtonShape::Square)
.icon_size(IconSize::Small)
.icon_color(if has_messages_notification {
Color::Default
@ -2332,7 +2332,7 @@ impl CollabPanel {
.child(
IconButton::new("channel_notes", IconName::File)
.style(ButtonStyle::Filled)
.size(ButtonSize::Compact)
.shape(ui::IconButtonShape::Square)
.icon_size(IconSize::Small)
.icon_color(if has_notes_notification {
Color::Default

17
crates/ui/src/components/button/icon_button.rs
View File

@ -127,16 +127,25 @@ impl VisibleOnHover for IconButton {
}
impl RenderOnce for IconButton {
fn render(self, _cx: &mut WindowContext) -> impl IntoElement {
fn render(self, cx: &mut WindowContext) -> impl IntoElement {
let is_disabled = self.base.disabled;
let is_selected = self.base.selected;
let selected_style = self.base.selected_style;
self.base
.map(|this| match self.shape {
IconButtonShape::Square => this
.width(self.icon_size.rems().into())
.height(self.icon_size.rems().into()),
IconButtonShape::Square => {
let icon_size = self.icon_size.rems() * cx.rem_size();
let padding = match self.icon_size {
IconSize::Indicator => px(0.),
IconSize::XSmall => px(0.),
IconSize::Small => px(2.),
IconSize::Medium => px(2.),
};
this.width((icon_size + padding * 2.).into())
.height((icon_size + padding * 2.).into())
}
IconButtonShape::Wide => this,
})
.child(

31
crates/ui/src/components/stories/icon_button.rs
View File

@ -1,7 +1,7 @@
use gpui::Render;
use story::{StoryContainer, StoryItem, StorySection};
use crate::{prelude::*, Tooltip};
use crate::{prelude::*, IconButtonShape, Tooltip};
use crate::{IconButton, IconName};
pub struct IconButtonStory;
@ -115,7 +115,34 @@ impl Render for IconButtonStory {
"Icon Button",
"crates/ui2/src/components/stories/icon_button.rs",
)
.children(vec![StorySection::new().children(buttons)])
.child(StorySection::new().children(buttons))
.child(
StorySection::new().child(StoryItem::new(
"Square",
h_flex()
.gap_2()
.child(
IconButton::new("square-medium", IconName::Close)
.shape(IconButtonShape::Square)
.icon_size(IconSize::Medium),
)
.child(
IconButton::new("square-small", IconName::Close)
.shape(IconButtonShape::Square)
.icon_size(IconSize::Small),
)
.child(
IconButton::new("square-xsmall", IconName::Close)
.shape(IconButtonShape::Square)
.icon_size(IconSize::XSmall),
)
.child(
IconButton::new("square-indicator", IconName::Close)
.shape(IconButtonShape::Square)
.icon_size(IconSize::Indicator),
),
)),
)
.into_element()
}
}