Update disabled menu, button, dropdown etc. to use default cursor. (#814)
To follow macOS UX design.
This commit is contained in:
parent
bbb267f2bf
commit
a9d145dd50
8 changed files with 13 additions and 33 deletions
|
|
@ -169,6 +169,8 @@ impl Render for MenuStory {
|
||||||
},
|
},
|
||||||
)
|
)
|
||||||
.separator()
|
.separator()
|
||||||
|
.menu_with_disabled("Disabled Item", Box::new(Info(0)), true)
|
||||||
|
.separator()
|
||||||
.submenu("Links", window, cx, |menu, _, _| {
|
.submenu("Links", window, cx, |menu, _, _| {
|
||||||
menu.link_with_icon(
|
menu.link_with_icon(
|
||||||
"GitHub Repository",
|
"GitHub Repository",
|
||||||
|
|
|
||||||
|
|
@ -469,8 +469,7 @@ impl RenderOnce for Button {
|
||||||
)
|
)
|
||||||
.when(self.disabled, |this| {
|
.when(self.disabled, |this| {
|
||||||
let disabled_style = style.disabled(self.outline, cx);
|
let disabled_style = style.disabled(self.outline, cx);
|
||||||
this.cursor_not_allowed()
|
this.bg(disabled_style.bg)
|
||||||
.bg(disabled_style.bg)
|
|
||||||
.text_color(disabled_style.fg)
|
.text_color(disabled_style.fg)
|
||||||
.border_color(disabled_style.border)
|
.border_color(disabled_style.border)
|
||||||
.shadow_none()
|
.shadow_none()
|
||||||
|
|
|
||||||
|
|
@ -181,8 +181,7 @@ impl RenderOnce for Checkbox {
|
||||||
)
|
)
|
||||||
})
|
})
|
||||||
.when(self.disabled, |this| {
|
.when(self.disabled, |this| {
|
||||||
this.cursor_not_allowed()
|
this.text_color(cx.theme().muted_foreground)
|
||||||
.text_color(cx.theme().muted_foreground)
|
|
||||||
})
|
})
|
||||||
.when_some(
|
.when_some(
|
||||||
self.on_click.filter(|_| !self.disabled),
|
self.on_click.filter(|_| !self.disabled),
|
||||||
|
|
|
||||||
|
|
@ -575,8 +575,7 @@ where
|
||||||
};
|
};
|
||||||
|
|
||||||
title.when(self.disabled, |this| {
|
title.when(self.disabled, |this| {
|
||||||
this.cursor_not_allowed()
|
this.text_color(cx.theme().muted_foreground)
|
||||||
.text_color(cx.theme().muted_foreground)
|
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
@ -648,13 +647,7 @@ where
|
||||||
.border_color(cx.theme().input)
|
.border_color(cx.theme().input)
|
||||||
.rounded(cx.theme().radius)
|
.rounded(cx.theme().radius)
|
||||||
.when(cx.theme().shadow, |this| this.shadow_sm())
|
.when(cx.theme().shadow, |this| this.shadow_sm())
|
||||||
.map(|this| {
|
.map(|this| if self.disabled { this } else { this })
|
||||||
if self.disabled {
|
|
||||||
this.cursor_not_allowed()
|
|
||||||
} else {
|
|
||||||
this
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.overflow_hidden()
|
.overflow_hidden()
|
||||||
.input_text_size(self.size)
|
.input_text_size(self.size)
|
||||||
.map(|this| match self.width {
|
.map(|this| match self.width {
|
||||||
|
|
@ -701,15 +694,12 @@ where
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
this.child(
|
this.child(Icon::new(icon).xsmall().text_color(
|
||||||
Icon::new(icon)
|
match self.disabled {
|
||||||
.xsmall()
|
true => cx.theme().muted_foreground.opacity(0.5),
|
||||||
.text_color(match self.disabled {
|
false => cx.theme().muted_foreground,
|
||||||
true => cx.theme().muted_foreground.opacity(0.5),
|
},
|
||||||
false => cx.theme().muted_foreground,
|
))
|
||||||
})
|
|
||||||
.when(self.disabled, |this| this.cursor_not_allowed()),
|
|
||||||
)
|
|
||||||
}),
|
}),
|
||||||
)
|
)
|
||||||
.child(
|
.child(
|
||||||
|
|
|
||||||
|
|
@ -143,8 +143,7 @@ impl RenderOnce for ListItem {
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
.when(self.disabled, |this| {
|
.when(self.disabled, |this| {
|
||||||
this.cursor_not_allowed()
|
this.text_color(cx.theme().muted_foreground)
|
||||||
.text_color(cx.theme().muted_foreground)
|
|
||||||
})
|
})
|
||||||
.child(
|
.child(
|
||||||
h_flex()
|
h_flex()
|
||||||
|
|
|
||||||
|
|
@ -172,7 +172,6 @@ impl Element for Switch {
|
||||||
.border(inset)
|
.border(inset)
|
||||||
.border_color(cx.theme().transparent)
|
.border_color(cx.theme().transparent)
|
||||||
.bg(bg)
|
.bg(bg)
|
||||||
.when(self.disabled, |this| this.cursor_not_allowed())
|
|
||||||
.when_some(self.tooltip.clone(), |this, tooltip| {
|
.when_some(self.tooltip.clone(), |this, tooltip| {
|
||||||
this.tooltip(move |window, cx| {
|
this.tooltip(move |window, cx| {
|
||||||
Tooltip::new(tooltip.clone()).build(window, cx)
|
Tooltip::new(tooltip.clone()).build(window, cx)
|
||||||
|
|
|
||||||
|
|
@ -583,7 +583,6 @@ impl RenderOnce for Tab {
|
||||||
.flex_wrap()
|
.flex_wrap()
|
||||||
.items_center()
|
.items_center()
|
||||||
.flex_shrink_0()
|
.flex_shrink_0()
|
||||||
.when(self.disabled, |this| this.cursor_not_allowed())
|
|
||||||
.overflow_hidden()
|
.overflow_hidden()
|
||||||
.h(height)
|
.h(height)
|
||||||
.overflow_hidden()
|
.overflow_hidden()
|
||||||
|
|
|
||||||
|
|
@ -473,13 +473,6 @@ impl Calendar {
|
||||||
_ => this.size_9().rounded(cx.theme().radius * 2.),
|
_ => this.size_9().rounded(cx.theme().radius * 2.),
|
||||||
})
|
})
|
||||||
.justify_center()
|
.justify_center()
|
||||||
.map(|this| {
|
|
||||||
if disabled {
|
|
||||||
this.cursor_not_allowed()
|
|
||||||
} else {
|
|
||||||
this
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.when(muted, |this| {
|
.when(muted, |this| {
|
||||||
this.text_color(if disabled {
|
this.text_color(if disabled {
|
||||||
cx.theme().muted_foreground.opacity(0.3)
|
cx.theme().muted_foreground.opacity(0.3)
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue