diff --git a/packages/oneclient_app/src/components/mod.rs b/packages/oneclient_app/src/components/mod.rs index c115d599..1da21773 100644 --- a/packages/oneclient_app/src/components/mod.rs +++ b/packages/oneclient_app/src/components/mod.rs @@ -63,5 +63,5 @@ pub use status_bar::StatusBar; pub use tab_bar::{TabBar, TabItem}; pub use text_input::{TextInput, validate_number}; pub use toasts::Toasts; -pub use toggle::{toggle, toggle_controlled}; +pub use toggle::{toggle, toggle_controlled, toggle_disabled}; pub use update_prompt::UpdatePromptOverlay; diff --git a/packages/oneclient_app/src/components/toggle.rs b/packages/oneclient_app/src/components/toggle.rs index 453ecdd4..0ada0323 100644 --- a/packages/oneclient_app/src/components/toggle.rs +++ b/packages/oneclient_app/src/components/toggle.rs @@ -14,6 +14,15 @@ pub fn toggle(value: State) -> impl IntoElement { Switch { value, on_press: (move |()| v.toggle()).into(), + disabled: false, + } +} + +pub fn toggle_disabled(value: State) -> impl IntoElement { + Switch { + value, + on_press: (|()| {}).into(), + disabled: true, } } @@ -34,6 +43,7 @@ impl Component for ToggleControlled { Switch { value, on_press: self.on_toggle.clone(), + disabled: false, } } } @@ -42,6 +52,7 @@ impl Component for ToggleControlled { struct Switch { value: State, on_press: EventHandler<()>, + disabled: bool, } impl Component for Switch { @@ -49,13 +60,14 @@ impl Component for Switch { let value = self.value; let on_press = self.on_press.clone(); let on = *value.read(); + let disabled = self.disabled; let a11y_id = use_a11y(); let focus = use_focus(a11y_id); let knob_align = if on { Alignment::End } else { Alignment::Start }; - let track_border = if focus().is_focused() { + let track_border = if focus().is_focused() && !disabled { colors::fg_primary() } else { colors::component_border() @@ -94,12 +106,14 @@ impl Component for Switch { .cross_align(Alignment::Center) .spacing(8.) .a11y_id(a11y_id) - .a11y_focusable(true) + .a11y_focusable(!disabled) .a11y_role(AccessibilityRole::Button) - .on_pointer_enter(|_| Cursor::set(CursorIcon::Pointer)) - .on_pointer_leave(|_| Cursor::set(CursorIcon::default())) - .on_all_press(move |_| { - on_press.call(()); + .maybe(!disabled, |el| { + el.on_pointer_enter(|_| Cursor::set(CursorIcon::Pointer)) + .on_pointer_leave(|_| Cursor::set(CursorIcon::default())) + .on_all_press(move |_| { + on_press.call(()); + }) }) .child( label() @@ -115,14 +129,22 @@ impl Component for Switch { .padding(Gaps::new_all(3.)) .main_align(knob_align) .cross_align(Alignment::Center) - .background(&*background.read()) + .background(if disabled { + colors::component_bg_disabled() + } else { + background.read().value() + }) .border(ui::border_all_color(1., track_border)) .child( rect() .width(Size::px(HANDLE_SIZE)) .height(Size::px(HANDLE_SIZE)) .corner_radius(CornerRadius::new_all(8.)) - .background(Color::WHITE) + .background(if disabled { + colors::fg_secondary() + } else { + Color::WHITE + }) .position(Position::new_absolute().right(right_offset.read().value())), ), ) diff --git a/packages/oneclient_app/src/view/app/settings/appearance.rs b/packages/oneclient_app/src/view/app/settings/appearance.rs index 3edc388b..70faffa5 100644 --- a/packages/oneclient_app/src/view/app/settings/appearance.rs +++ b/packages/oneclient_app/src/view/app/settings/appearance.rs @@ -1,11 +1,11 @@ use freya::prelude::*; use super::settings_page; -use crate::components::{Icon, IconType, toggle}; +use crate::components::{Icon, IconType, toggle, toggle_disabled}; use crate::hooks::{use_dispatch, use_settings_snapshot}; use crate::theme::colors; use crate::ui::border_all_color; -use crate::view::app::settings::settings_row; +use crate::view::app::settings::{settings_row, settings_row_disabled}; #[derive(Clone, Copy)] struct ThemePreview { @@ -104,6 +104,7 @@ fn theme_section(selected: State) -> impl IntoElement { rect() .horizontal() .spacing(16.) + .opacity(0.4) .child(big_preview(current)) .child( rect() @@ -150,7 +151,7 @@ fn big_preview(theme: ThemePreview) -> impl IntoElement { .into_element() } -fn theme_card(theme: ThemePreview, index: usize, mut selected: State) -> Element { +fn theme_card(theme: ThemePreview, index: usize, selected: State) -> Element { let is_selected = *selected.read() == index; let border_color = if is_selected { colors::brand() @@ -167,9 +168,6 @@ fn theme_card(theme: ThemePreview, index: usize, mut selected: State) -> .border(border_all_color(1., border_color)) .padding(8.) .spacing(20.) - .on_pointer_enter(|_| Cursor::set(CursorIcon::Pointer)) - .on_pointer_leave(|_| Cursor::set(CursorIcon::default())) - .on_press(move |_| *selected.write() = index) .child(mock_line(108., line_tint(theme))) .child(split_bar(theme.accent, 96.)) .into_element() @@ -210,7 +208,7 @@ fn line_tint(theme: ThemePreview) -> Color { } fn accent_color_row() -> impl IntoElement { - settings_row( + settings_row_disabled( IconType::PaintPour, "Accent color", "The main color used across the launcher. This doesn't edit your theme.", @@ -233,7 +231,7 @@ fn accent_color_row() -> impl IntoElement { } fn custom_theme_row() -> impl IntoElement { - settings_row( + settings_row_disabled( IconType::Colors, "Custom theme", "Create, edit, and import launcher themes", @@ -251,10 +249,10 @@ fn dynamic_background_row(enabled: State) -> impl IntoElement { } fn animations_row(animations_on: State) -> impl IntoElement { - settings_row( + settings_row_disabled( IconType::Play, "Animations", "Toggle all animations in the launcher. May cause buggy behavior.", - toggle(animations_on), + toggle_disabled(animations_on), ) } diff --git a/packages/oneclient_app/src/view/app/settings/developer.rs b/packages/oneclient_app/src/view/app/settings/developer.rs index 3a354900..c4d2c8d7 100644 --- a/packages/oneclient_app/src/view/app/settings/developer.rs +++ b/packages/oneclient_app/src/view/app/settings/developer.rs @@ -43,12 +43,6 @@ impl Component for SettingsDeveloper { "Filter the content browser to the active cluster's version and loader.", toggle(browser_compat), )) - .child(settings_row( - IconType::InfoCircle, - "Open Debug Info", - "View runtime and environment details.", - Button::new(), - )) .child(section_header("DEV TOOLS")) .child(settings_row( IconType::Terminal, @@ -56,12 +50,6 @@ impl Component for SettingsDeveloper { "WARNING! This requires a restart to apply. Logs out debug info.", toggle(log_debug), )) - .child(settings_row( - IconType::CodeSnippet02, - "Show Dev stuff", - "Enable the dev tools and shows the debug page.", - toggle(show_dev), - )) .child(settings_row( IconType::CodeSnippet02, "Debug Page", diff --git a/packages/oneclient_app/src/view/app/settings/mod.rs b/packages/oneclient_app/src/view/app/settings/mod.rs index 16a2434c..0c982718 100644 --- a/packages/oneclient_app/src/view/app/settings/mod.rs +++ b/packages/oneclient_app/src/view/app/settings/mod.rs @@ -48,9 +48,29 @@ pub fn settings_row( title: &'static str, description: impl Into, trailing: impl IntoElement, +) -> impl IntoElement { + settings_row_inner(icon, title, description, trailing, false) +} + +pub fn settings_row_disabled( + icon: IconType, + title: &'static str, + description: impl Into, + trailing: impl IntoElement, +) -> impl IntoElement { + settings_row_inner(icon, title, description, trailing, true) +} + +fn settings_row_inner( + icon: IconType, + title: &'static str, + description: impl Into, + trailing: impl IntoElement, + disabled: bool, ) -> impl IntoElement { let description = description.into(); rect() + .maybe(disabled, |el| el.opacity(0.4)) .horizontal() .width(Size::fill()) .content(Content::Flex)