Inset ContextMenu headers (#9197)

This PR insets the headers within `ContextMenu`s to give them some more
breathing room.

#### Before

<img width="347" alt="Screenshot 2024-03-11 at 4 13 31 PM"
src="https://github.com/zed-industries/zed/assets/1486634/73a56d68-d40e-4396-b584-f443197b69d6">

#### After

<img width="354" alt="Screenshot 2024-03-11 at 4 12 43 PM"
src="https://github.com/zed-industries/zed/assets/1486634/44c12a07-0784-4c94-b194-245f5cf94b2b">

Release Notes:

- Added padding to headers in context menus.
This commit is contained in:
Marshall Bowers 2024-03-11 16:28:16 -04:00 committed by GitHub
parent 02dcdd0228
commit c0b1f74794
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 80 additions and 71 deletions

View file

@ -272,80 +272,84 @@ impl Render for ContextMenu {
})
.flex_none()
.child(List::new().children(self.items.iter_mut().enumerate().map(
|(ix, item)| match item {
ContextMenuItem::Separator => ListSeparator.into_any_element(),
ContextMenuItem::Header(header) => {
ListSubHeader::new(header.clone()).into_any_element()
}
ContextMenuItem::Entry {
label,
handler,
icon,
action,
} => {
let handler = handler.clone();
let menu = cx.view().downgrade();
let label_element = if let Some(icon) = icon {
h_flex()
.gap_1()
.child(Label::new(label.clone()))
.child(Icon::new(*icon))
.into_any_element()
} else {
Label::new(label.clone()).into_any_element()
};
ListItem::new(ix)
|(ix, item)| {
match item {
ContextMenuItem::Separator => ListSeparator.into_any_element(),
ContextMenuItem::Header(header) => ListSubHeader::new(header.clone())
.inset(true)
.selected(Some(ix) == self.selected_index)
.on_click(move |_, cx| {
handler(cx);
menu.update(cx, |menu, cx| {
menu.clicked = true;
cx.emit(DismissEvent);
})
.ok();
})
.child(
.into_any_element(),
ContextMenuItem::Entry {
label,
handler,
icon,
action,
} => {
let handler = handler.clone();
let menu = cx.view().downgrade();
let label_element = if let Some(icon) = icon {
h_flex()
.w_full()
.justify_between()
.child(label_element)
.debug_selector(|| format!("MENU_ITEM-{}", label))
.children(action.as_ref().and_then(|action| {
self.action_context
.as_ref()
.map(|focus| {
KeyBinding::for_action_in(&**action, focus, cx)
})
.unwrap_or_else(|| {
KeyBinding::for_action(&**action, cx)
})
.map(|binding| div().ml_1().child(binding))
})),
)
.into_any_element()
}
ContextMenuItem::CustomEntry {
entry_render,
handler,
} => {
let handler = handler.clone();
let menu = cx.view().downgrade();
ListItem::new(ix)
.inset(true)
.selected(Some(ix) == self.selected_index)
.on_click(move |_, cx| {
handler(cx);
menu.update(cx, |menu, cx| {
menu.clicked = true;
cx.emit(DismissEvent);
.gap_1()
.child(Label::new(label.clone()))
.child(Icon::new(*icon))
.into_any_element()
} else {
Label::new(label.clone()).into_any_element()
};
ListItem::new(ix)
.inset(true)
.selected(Some(ix) == self.selected_index)
.on_click(move |_, cx| {
handler(cx);
menu.update(cx, |menu, cx| {
menu.clicked = true;
cx.emit(DismissEvent);
})
.ok();
})
.ok();
})
.child(entry_render(cx))
.into_any_element()
.child(
h_flex()
.w_full()
.justify_between()
.child(label_element)
.debug_selector(|| format!("MENU_ITEM-{}", label))
.children(action.as_ref().and_then(|action| {
self.action_context
.as_ref()
.map(|focus| {
KeyBinding::for_action_in(
&**action, focus, cx,
)
})
.unwrap_or_else(|| {
KeyBinding::for_action(&**action, cx)
})
.map(|binding| div().ml_1().child(binding))
})),
)
.into_any_element()
}
ContextMenuItem::CustomEntry {
entry_render,
handler,
} => {
let handler = handler.clone();
let menu = cx.view().downgrade();
ListItem::new(ix)
.inset(true)
.selected(Some(ix) == self.selected_index)
.on_click(move |_, cx| {
handler(cx);
menu.update(cx, |menu, cx| {
menu.clicked = true;
cx.emit(DismissEvent);
})
.ok();
})
.child(entry_render(cx))
.into_any_element()
}
}
},
))),

View file

@ -21,6 +21,11 @@ impl ListSubHeader {
self.start_slot = left_icon;
self
}
pub fn inset(mut self, inset: bool) -> Self {
self.inset = inset;
self
}
}
impl RenderOnce for ListSubHeader {