Polish onboarding page (#35367)
- Added borders to the numeric stepper. - Changed the hover mouse style for SwitchField. - Made the edit page toggle buttons more responsive. Release Notes: - N/A
This commit is contained in:
parent
afcb8f2a3f
commit
2d4afd2119
4 changed files with 92 additions and 32 deletions
|
@ -21,6 +21,14 @@ fn read_show_mini_map(cx: &App) -> ShowMinimap {
|
|||
fn write_show_mini_map(show: ShowMinimap, cx: &mut App) {
|
||||
let fs = <dyn Fs>::global(cx);
|
||||
|
||||
// This is used to speed up the UI
|
||||
// the UI reads the current values to get what toggle state to show on buttons
|
||||
// there's a slight delay if we just call update_settings_file so we manually set
|
||||
// the value here then call update_settings file to get around the delay
|
||||
let mut curr_settings = EditorSettings::get_global(cx).clone();
|
||||
curr_settings.minimap.show = show;
|
||||
EditorSettings::override_global(curr_settings, cx);
|
||||
|
||||
update_settings_file::<EditorSettings>(fs, cx, move |editor_settings, _| {
|
||||
editor_settings.minimap.get_or_insert_default().show = Some(show);
|
||||
});
|
||||
|
@ -36,6 +44,10 @@ fn read_inlay_hints(cx: &App) -> bool {
|
|||
fn write_inlay_hints(enabled: bool, cx: &mut App) {
|
||||
let fs = <dyn Fs>::global(cx);
|
||||
|
||||
let mut curr_settings = AllLanguageSettings::get_global(cx).clone();
|
||||
curr_settings.defaults.inlay_hints.enabled = enabled;
|
||||
AllLanguageSettings::override_global(curr_settings, cx);
|
||||
|
||||
update_settings_file::<AllLanguageSettings>(fs, cx, move |all_language_settings, cx| {
|
||||
all_language_settings
|
||||
.defaults
|
||||
|
@ -57,6 +69,14 @@ fn read_git_blame(cx: &App) -> bool {
|
|||
fn set_git_blame(enabled: bool, cx: &mut App) {
|
||||
let fs = <dyn Fs>::global(cx);
|
||||
|
||||
let mut curr_settings = ProjectSettings::get_global(cx).clone();
|
||||
curr_settings
|
||||
.git
|
||||
.inline_blame
|
||||
.get_or_insert_default()
|
||||
.enabled = enabled;
|
||||
ProjectSettings::override_global(curr_settings, cx);
|
||||
|
||||
update_settings_file::<ProjectSettings>(fs, cx, move |project_settings, _| {
|
||||
project_settings
|
||||
.git
|
||||
|
@ -171,16 +191,19 @@ pub(crate) fn render_editing_page(window: &mut Window, cx: &mut App) -> impl Int
|
|||
menu
|
||||
}),
|
||||
)))
|
||||
.child(NumericStepper::new(
|
||||
"ui-font-size",
|
||||
ui_font_size.to_string(),
|
||||
move |_, _, cx| {
|
||||
write_ui_font_size(ui_font_size - px(1.), cx);
|
||||
},
|
||||
move |_, _, cx| {
|
||||
write_ui_font_size(ui_font_size + px(1.), cx);
|
||||
},
|
||||
)),
|
||||
.child(
|
||||
NumericStepper::new(
|
||||
"ui-font-size",
|
||||
ui_font_size.to_string(),
|
||||
move |_, _, cx| {
|
||||
write_ui_font_size(ui_font_size - px(1.), cx);
|
||||
},
|
||||
move |_, _, cx| {
|
||||
write_ui_font_size(ui_font_size + px(1.), cx);
|
||||
},
|
||||
)
|
||||
.border(),
|
||||
),
|
||||
),
|
||||
)
|
||||
.child(
|
||||
|
@ -222,16 +245,19 @@ pub(crate) fn render_editing_page(window: &mut Window, cx: &mut App) -> impl Int
|
|||
menu
|
||||
}),
|
||||
))
|
||||
.child(NumericStepper::new(
|
||||
"buffer-font-size",
|
||||
buffer_font_size.to_string(),
|
||||
move |_, _, cx| {
|
||||
write_buffer_font_size(buffer_font_size - px(1.), cx);
|
||||
},
|
||||
move |_, _, cx| {
|
||||
write_buffer_font_size(buffer_font_size + px(1.), cx);
|
||||
},
|
||||
)),
|
||||
.child(
|
||||
NumericStepper::new(
|
||||
"buffer-font-size",
|
||||
buffer_font_size.to_string(),
|
||||
move |_, _, cx| {
|
||||
write_buffer_font_size(buffer_font_size - px(1.), cx);
|
||||
},
|
||||
move |_, _, cx| {
|
||||
write_buffer_font_size(buffer_font_size + px(1.), cx);
|
||||
},
|
||||
)
|
||||
.border(),
|
||||
),
|
||||
),
|
||||
),
|
||||
)
|
||||
|
|
|
@ -376,7 +376,7 @@ impl Render for Onboarding {
|
|||
),
|
||||
)
|
||||
.p_1()
|
||||
.child(Divider::horizontal_dashed())
|
||||
.child(Divider::horizontal())
|
||||
.child(
|
||||
v_flex().gap_1().children([
|
||||
self.render_page_nav(SelectedPage::Basics, window, cx)
|
||||
|
@ -388,7 +388,7 @@ impl Render for Onboarding {
|
|||
]),
|
||||
),
|
||||
)
|
||||
// .child(Divider::vertical_dashed())
|
||||
.child(div().child(Divider::vertical()).h_full())
|
||||
.child(div().w_2_3().h_full().child(self.render_page(window, cx)))
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
use gpui::ClickEvent;
|
||||
|
||||
use crate::{IconButtonShape, prelude::*};
|
||||
use crate::{Divider, IconButtonShape, prelude::*};
|
||||
|
||||
#[derive(IntoElement, RegisterComponent)]
|
||||
pub struct NumericStepper {
|
||||
|
@ -11,6 +11,7 @@ pub struct NumericStepper {
|
|||
/// Whether to reserve space for the reset button.
|
||||
reserve_space_for_reset: bool,
|
||||
on_reset: Option<Box<dyn Fn(&ClickEvent, &mut Window, &mut App) + 'static>>,
|
||||
border: bool,
|
||||
}
|
||||
|
||||
impl NumericStepper {
|
||||
|
@ -25,6 +26,7 @@ impl NumericStepper {
|
|||
value: value.into(),
|
||||
on_decrement: Box::new(on_decrement),
|
||||
on_increment: Box::new(on_increment),
|
||||
border: false,
|
||||
reserve_space_for_reset: false,
|
||||
on_reset: None,
|
||||
}
|
||||
|
@ -42,6 +44,11 @@ impl NumericStepper {
|
|||
self.on_reset = Some(Box::new(on_reset));
|
||||
self
|
||||
}
|
||||
|
||||
pub fn border(mut self) -> Self {
|
||||
self.border = true;
|
||||
self
|
||||
}
|
||||
}
|
||||
|
||||
impl RenderOnce for NumericStepper {
|
||||
|
@ -74,8 +81,11 @@ impl RenderOnce for NumericStepper {
|
|||
.child(
|
||||
h_flex()
|
||||
.gap_1()
|
||||
.when(self.border, |this| {
|
||||
this.border_1().border_color(cx.theme().colors().border)
|
||||
})
|
||||
.px_1()
|
||||
.rounded_xs()
|
||||
.rounded_sm()
|
||||
.bg(cx.theme().colors().editor_background)
|
||||
.child(
|
||||
IconButton::new("decrement", IconName::Dash)
|
||||
|
@ -83,7 +93,13 @@ impl RenderOnce for NumericStepper {
|
|||
.icon_size(icon_size)
|
||||
.on_click(self.on_decrement),
|
||||
)
|
||||
.when(self.border, |this| {
|
||||
this.child(Divider::vertical().color(super::DividerColor::Border))
|
||||
})
|
||||
.child(Label::new(self.value))
|
||||
.when(self.border, |this| {
|
||||
this.child(Divider::vertical().color(super::DividerColor::Border))
|
||||
})
|
||||
.child(
|
||||
IconButton::new("increment", IconName::Plus)
|
||||
.shape(shape)
|
||||
|
@ -113,12 +129,27 @@ impl Component for NumericStepper {
|
|||
|
||||
fn preview(_window: &mut Window, _cx: &mut App) -> Option<AnyElement> {
|
||||
Some(
|
||||
div()
|
||||
.child(NumericStepper::new(
|
||||
"numeric-stepper-component-preview",
|
||||
"10",
|
||||
move |_, _, _| {},
|
||||
move |_, _, _| {},
|
||||
v_flex()
|
||||
.child(single_example(
|
||||
"Borderless",
|
||||
NumericStepper::new(
|
||||
"numeric-stepper-component-preview",
|
||||
"10",
|
||||
move |_, _, _| {},
|
||||
move |_, _, _| {},
|
||||
)
|
||||
.into_any_element(),
|
||||
))
|
||||
.child(single_example(
|
||||
"Border",
|
||||
NumericStepper::new(
|
||||
"numeric-stepper-with-border-component-preview",
|
||||
"10",
|
||||
move |_, _, _| {},
|
||||
move |_, _, _| {},
|
||||
)
|
||||
.border()
|
||||
.into_any_element(),
|
||||
))
|
||||
.into_any_element(),
|
||||
)
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
use gpui::{
|
||||
AnyElement, AnyView, ClickEvent, ElementId, Hsla, IntoElement, Styled, Window, div, hsla,
|
||||
prelude::*,
|
||||
AnyElement, AnyView, ClickEvent, CursorStyle, ElementId, Hsla, IntoElement, Styled, Window,
|
||||
div, hsla, prelude::*,
|
||||
};
|
||||
use std::sync::Arc;
|
||||
|
||||
|
@ -609,6 +609,9 @@ impl RenderOnce for SwitchField {
|
|||
fn render(self, _window: &mut Window, _cx: &mut App) -> impl IntoElement {
|
||||
h_flex()
|
||||
.id(SharedString::from(format!("{}-container", self.id)))
|
||||
.when(!self.disabled, |this| {
|
||||
this.hover(|this| this.cursor(CursorStyle::PointingHand))
|
||||
})
|
||||
.w_full()
|
||||
.gap_4()
|
||||
.justify_between()
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue