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

Iterate on design of channel management modal (#3923)

Browse source 
This PR refines the design of the channel management modal:

#### Before

<img width="585" alt="Screenshot 2024-01-05 at 4 17 32 PM"
src="https://github.com/zed-industries/zed/assets/1486634/a6d96674-b688-4549-8fb8-0a7b2c7c88be">

#### After

<img width="589" alt="Screenshot 2024-01-05 at 4 15 20 PM"
src="https://github.com/zed-industries/zed/assets/1486634/31ae8dc1-a129-4a15-963e-9779b9b79bd9">

Release Notes:

- Improved the look of the channel management modal.
This commit is contained in:
Marshall Bowers 2024-01-05 16:22:43 -05:00 • committed by GitHub
parent 6cb8b86aeb
commit be98ff408e
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 65 additions and 181 deletions
Download patch file Download diff file Expand all files Collapse all files

67
crates/collab_ui/src/collab_panel/channel_modal.rs
View file

@ -162,8 +162,7 @@ impl Render for ChannelModal {
v_stack()
.px_2()
.py_1()
.rounded_t(px(8.))
.bg(cx.theme().colors().element_background)
.gap_2()
.child(
h_stack()
.w_px()
@ -175,7 +174,9 @@ impl Render for ChannelModal {
.child(
h_stack()
.w_full()
.h(rems(22. / 16.))
.justify_between()
.line_height(rems(1.25))
.child(
h_stack()
.gap_2()
@ -190,38 +191,54 @@ impl Render for ChannelModal {
)
.on_click(cx.listener(Self::set_channel_visiblity)),
)
.child(Label::new("Public")),
.child(Label::new("Public").size(LabelSize::Small)),
)
.children(if visibility == ChannelVisibility::Public {
Some(Button::new("copy-link", "Copy Link").on_click(cx.listener(
move |this, _, cx| {
if let Some(channel) =
this.channel_store.read(cx).channel_for_id(channel_id)
{
let item = ClipboardItem::new(channel.link());
cx.write_to_clipboard(item);
}
},
)))
} else {
None
}),
.children(
Some(
Button::new("copy-link", "Copy Link")
.label_size(LabelSize::Small)
.on_click(cx.listener(move |this, _, cx| {
if let Some(channel) = this
.channel_store
.read(cx)
.channel_for_id(channel_id)
{
let item = ClipboardItem::new(channel.link());
cx.write_to_clipboard(item);
}
})),
)
.filter(|_| visibility == ChannelVisibility::Public),
),
)
.child(
div()
.w_full()
.flex()
.flex_row()
h_stack()
.child(
Button::new("manage-members", "Manage Members")
.selected(mode == Mode::ManageMembers)
div()
.id("manage-members")
.px_2()
.py_1()
.cursor_pointer()
.border_b_2()
.when(mode == Mode::ManageMembers, |this| {
this.border_color(cx.theme().colors().border)
})
.child(Label::new("Manage Members"))
.on_click(cx.listener(|this, _, cx| {
this.set_mode(Mode::ManageMembers, cx);
})),
)
.child(
Button::new("invite-members", "Invite Members")
.selected(mode == Mode::InviteMembers)
div()
.id("invite-members")
.px_2()
.py_1()
.cursor_pointer()
.border_b_2()
.when(mode == Mode::InviteMembers, |this| {
this.border_color(cx.theme().colors().border)
})
.child(Label::new("Invite Members"))
.on_click(cx.listener(|this, _, cx| {
this.set_mode(Mode::InviteMembers, cx);
})),